PWA集成Firebase Cloud Messaging遇gcm_sender_id错误求助

我之前也踩过这个坑，别慌，咱们从几个常见的排查点入手：

• 确认GCM Sender ID的正确性
  这里要注意：GCM Sender ID其实就是Firebase项目的项目编号，不是API Key也不是其他ID。你可以打开Firebase控制台，进入目标项目的「设置」→「常规」标签，找到「项目编号」——这个纯数字的字符串就是你要填在manifest.json里的gcm_sender_id值。一定要保证完全一致，不能多空格、少数字或者拼写错误。

• 检查manifest.json的配置和位置

  • 确保manifest.json放在网站的根目录，并且在index.html里通过<link rel="manifest" href="/manifest.json">正确引入了它。
  • 键名必须是小写的"gcm_sender_id"，不能写成大写或者其他变体（比如"GCM_Sender_ID"），JSON对大小写是敏感的。
  • 验证manifest.json的语法是否正确，比如有没有漏写逗号、引号是否配对，可以用在线JSON校验工具检查一下。

• 升级Firebase SDK版本
  你用的4.1.1版本实在太老了，和现在的FCM服务可能存在兼容性问题。建议升级到较新的稳定版本，比如8.x系列（兼容旧写法）或者9.x+的模块化版本。举个例子，把引入的脚本换成：

  <script src="https://www.gstatic.com/firebasejs/8.10.0/firebase-app.js"></script>
  <script src="https://www.gstatic.com/firebasejs/8.10.0/firebase-messaging.js"></script>
  

  然后确保配置代码和对应版本的要求一致。

• 确认Firebase配置的项目一致性
  检查index.html里的config对象（apiKey、authDomain等）是否和你获取GCM Sender ID的那个Firebase项目完全匹配。很多时候出错是因为不小心用了另一个项目的配置，导致Sender ID不匹配。

• Service Worker的相关检查
  FCM依赖Service Worker处理后台消息，要确保：

  • 你正确注册了Service Worker，比如在主脚本里调用messaging.useServiceWorker(registration)。
  • Service Worker文件（通常是firebase-messaging-sw.js）放在网站根目录，并且里面的Firebase初始化配置和主页面的一致。
  • 如果是旧版本SDK，Service Worker的代码要符合对应版本的要求，比如不能混用新版本的API。

最后，记得清除浏览器缓存，重新加载页面，然后打开开发者工具的「Application」标签，检查Manifest里的gcm_sender_id是否正确显示，同时在「Console」里查看有没有其他相关错误提示，帮助进一步定位问题。

内容的提问来源于stack exchange，提问作者Cohchi