Firebase Cloud Messaging应用授权通知后出现多个报错寻求解决

数据老陈

2026-10-3

修复方案

所有错误都是Firebase 9模块化SDK使用不当导致，按以下步骤修改即可：

1. 修复`onTokenRefresh is not defined`报错

Firebase 9 模块化版本已经移除了旧版的onTokenRefresh全局API，你也没有从SDK中导入该方法。

修复操作：直接删除index.html中onTokenRefresh(function () { ... })的整段代码即可。FCM新版本会自动维护token有效性，每次调用getToken都会返回最新的有效token，不需要单独监听刷新事件。

2. 修复`Cannot read properties of undefined (reading 'vapidKey')`报错

你在Notification.requestPermission的回调里调用getToken()没有传入初始化完成的messaging实例，导致方法内部找不到配置的vapidKey。

修复操作：把return getToken();改成return getToken(messaging, { vapidKey: "你自己的真实vapidKey" });，把后续单独写的那段重复的getToken(messaging, { vapidKey: "293kfk" })代码删掉就行，不用重复调用两次getToken。
额外注意：你现在填的293kfk是无效值，要替换成你Firebase控制台「项目设置-云消息传递」里生成的「Web 推送证书」公钥。

3. 修复ServiceWorker注册失败报错

你在firebase-messaging-sw.js里用importScripts加载的是纯模块化版本的Firebase SDK，importScripts不支持加载这种模块化包，要换成compat兼容版本的SDK地址。

修复操作：把firebase-messaging-sw.js开头的三行importScripts替换成：

importScripts('https://www.gstatic.com/firebasejs/9.0.2/firebase-app-compat.js');
importScripts('https://www.gstatic.com/firebasejs/9.0.2/firebase-messaging-compat.js');