firebase.messaging.getToken() 在 Google Chrome 上无法正常工作

Question

我正在努力确保每当我通过messaging.getToken() 请求一个fcm 设备令牌时，我都能从firebase 获得一个。虽然我在 Google Chrome 上不断检索令牌时遇到问题，但它会间歇性工作。

当我在 Firefox 上测试在页面刷新时获取 FCM 设备令牌时，它每次都能正常工作，并且我在回调函数中收到一个令牌。

另一方面，谷歌浏览器完全不同，我只能间歇性地收到一个令牌。我的代码在控制台中打印“已授予通知权限”时停止运行。没有来自 catch 块的错误消息。

经过进一步调查，我发现函数 messing.getToken() 没有返回令牌，即它是未定义的，同样，这只发生在我使用谷歌浏览器时。

我也尝试在 Brave 浏览器中执行此操作，其行为类似于 Google Chrome，但使用 Google Chrome 时，我将以下代码粘贴到控制台：

if(token){
console.log("value of token is:", token)
}
else
{
console.log("value of token is:", token);
}
});

它实际上打印了令牌，而 Brave 没有。 那么当然 IE 和 Safari 不支持 Firebase 消息传递

代码

firebase-init.js：

var firebaseConfig = {
     apiKey: "api-key-here",
     authDomain: "domain-here",
     databaseURL: "data-base-url-here",
     projectId: "project-id",
     storageBucket: "storage-bucket",
     messagingSenderId: "sender-id-here",
     appId: "app-id-here"
 };
 console.log(firebase);
 firebase.initializeApp(firebaseConfig);
 const messaging = firebase.messaging();
 
 // Request for permission
         Notification.requestPermission()
             .then((permission) => {
                
                
                 console.log('Notification permission granted.');
                 console.log(permission);
             //code stops running here on google chrome
             messaging.getToken()
                     .then((currentToken) => {
                         if (currentToken) {
                             console.log('Token: ' + currentToken);
                             sendTokenToServer(currentToken);
                             var data = { newToken: currentToken };
                             var url = "/Account/UpdateFirebaseToken";
                             $.ajax({
                                 url: url,
                                 type: "POST",
                                 data: JSON.stringify(data),
                                 dataType: "text",
                                 processData: false,
                                 contentType: "application/json; charset=utf-8",
                                 success: function (data, status, jqXHR) {
                                     console.log("successfully retrieved token:", data, status, jqXHR);
                                 },
                                 error: function (jqXHR, status, err) {
                                     console.log(err);
                                 },
                                 complete: function (jqXHR, status) {
                                     console.log("request complete");
                                 }
                             });
                         } else {
                              //doesn't reach here
                             console.log('No Instance ID token available. Request permission to generate one.');
                             setTokenSentToServer(false);
                         }
                     })
                     .catch(function (err) {
                         //doesn't reach here either
                         console.log('An error occurred while retrieving token. ', err);
                         setTokenSentToServer(false);
                     });
             })
             .catch(function (err) {
                 console.log('Unable to get permission to notify.', err);
             });

    //});

firebase-messaging-sw.js：

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

var config = {
    apiKey: "api-key-here",
    authDomain: "auth-domain-here",
    messagingSenderId: "sender-id",
};
firebase.initializeApp(config);

var messaging = firebase.messaging();
messaging.setBackgroundMessageHandler(function (payload) {
    var dataFromServer = JSON.parse(payload.data.notification);
    var notificationTitle = dataFromServer.title;
    var notificationOptions = {
        body: dataFromServer.body,
        icon: dataFromServer.icon,
        data: {
            url: dataFromServer.url
        }
    };
    return self.registration.showNotification(notificationTitle, notificationOptions);
});

self.addEventListener("notificationclick", function (event) {
    var urlToRedirect = event.notification.data.url;
    event.notification.close();
    event.waitUntil(self.clients.openWindow(urlToRedirect));
});

Answer 1

删除以下脚本标签：

<script src="https://cdn.jsdelivr.net/npm/promise-polyfill"></script>

我的 _Layout.cshtml 解决了这个问题。

我不确定该脚本是如何干扰承诺的，但如果有人能向我解释一下，我将不胜感激。

Answer 2

好像和IndexedDB有关（调试的时候就挂了 firebase 代码）。

虽然我是通过 webpack 构建注入 promise-polyfill，但我遇到了与您完全相同的问题。你的帖子让我解决了一些让我发疯了好几个星期的问题。

我通过仅在不存在 window.Promise 时应用 polyfill 解决了我的特定问题，以便我的代码（和 firebase SDK）将使用本机 Promise。