PHP项目集成Firebase Cloud Messaging获取设备令牌时遭遇DOMException: atob执行错误求助

我来帮你搞定这个问题！你碰到的这个DOMException: 无法在'Window'上执行'atob'：要解码的字符串编码不正确错误，几乎可以确定是传入的Vapid公钥格式不对导致的，下面是具体的排查和解决步骤：

1. 确认Vapid Key的正确格式 #

Firebase的messaging.usePublicVapidKey()方法要求传入的是完整的、未被修改的base64编码公钥，不能有多余的空格、换行符，也不能截断或省略字符。你代码里的**********SjpDQfr4gm6NvOmUvH2UoPCqxthqY应该是手动省略的内容，但实际使用时必须粘贴完整的公钥。

2. 正确获取Firebase的Vapid公钥 #

你可以从Firebase控制台获取官方的公钥：

• 打开你的Firebase项目，进入Cloud Messaging页面
• 找到Web configuration板块，在Key pair下点击“生成密钥对”（如果还没有的话）
• 复制生成的公钥（注意是公钥，不是私钥），直接粘贴到代码中，不要做任何修改

3. 修正你的代码 #

把正确的公钥替换到usePublicVapidKey中，示例如下：

<script type="module">
import "https://www.gstatic.com/firebasejs/8.1.0/firebase-app.js";
import "https://www.gstatic.com/firebasejs/8.1.0/firebase-messaging.js";
const firebaseConfig = {
  apiKey: "************",
  authDomain: "*************",
  databaseURL: "***********",
  projectId: "*****bdb20",
  storageBucket: "*********com",
  messagingSenderId: "***************",
  appId: "**************",
  measurementId: "G-7HS1PXRZMR"
};
// Initialize Firebase
firebase.initializeApp(firebaseConfig);
const messaging = firebase.messaging();
// 这里替换成你从Firebase控制台复制的完整公钥
messaging.usePublicVapidKey('你的完整base64公钥');
messaging.getToken().then((currentToken) => {
  if (currentToken) {
    console.log(currentToken);
  } else {
    console.log('No registration token available. Request permission to generate one.');
  }
}).catch((err) => {
  console.log('An error occurred while retrieving token. ', err);
});
</script>

4. 额外测试步骤 #

• 替换公钥后，清除浏览器的缓存和Service Worker缓存
• 重新加载页面，确保浏览器允许通知权限
• 打开控制台查看是否还有错误

如果还是有问题，可以检查：

• 你使用的Firebase SDK版本（8.1.0是稳定版本，没问题）
• 确保你的网站是HTTPS环境（localhost除外，FCM允许本地开发使用HTTP）

内容的提问来源于stack exchange，提问作者Rk dev tech