设置背景消息处理程序不会在 Chrome 中显示该消息

Question

importScripts('https：//www.gstatic.com/firebasejs/6.3.4/firebase-app.js'(; importScripts('https：//www.gstatic.com/firebasejs/6.3.4/firebase-messaging.js'(;

firebase.initializeApp({
apiKey: "xxxxxxxxxxxx",
authDomain: "xxxxxxxxxxxx",
databaseURL: "https://xxxxxxxxxxxx",
projectId: "xxxxxxxxxxxx",
storageBucket: "",
messagingSenderId: "xxxxxxxxxxxx",
appId: "xxxxxxxxxxxx"
})
/*
Retrieve an instance of Firebase Messaging so that it can handle background messages.
*/
const messaging = firebase.messaging()
messaging.setBackgroundMessageHandler(function (payload) {
console.log('[firebase-messaging-sw.js] Received background message ', payload);
const notification = JSON.parse(payload.data.notification);
// Customize notification here
const notificationTitle = notification.title;
const notificationOptions = {
body: notification.body,
icon: notification.icon
};
return self.registration.showNotification(notificationTitle,
notificationOptions);
});

有效载荷：

{
"data":{
"notification": {
"title": "Firebase",
"body": "test",
"click_action": "http://xxxxx",
"icon": "icon.png"
}}
,
"to": "/topics/all"
}

执行调试器时，有效负载数据到达 setBackgroundMessageHandler 方法，当到达 self.registration.showNotification 不显示弹出消息窗口，并且控制台不标记错误，chrome 桌面 Versión 77.0.3865.90 (官方内部( (64 位( 在 Mozilla 中，如果它显示弹出消息

可能会发生什么？

是否可以放置 Google 跟踪代码管理器来捕获弹出窗口点击？ 用于后台进程

问候

Answer 1

您是否尝试过像这样初始化消息传递服务？

// init FCM 
const initFCM = async messaging => {
try {
const permission = await Notification.requestPermission()
permission === 'granted' ? console.log(messaging) : console.log('Failed!')
// console.log("Successful")
} catch (error) {
console.log('Error', error)
}
}
//use on load
document.addEventListener('DOMContentLoaded', () => {
const messaging = firebase.messaging()
messaging.usePublicVapidKey('GET_THIS_FROM_FIREBASE_CONSOLE')
initFCM(messaging)
})

始终看到：messaging.onMessage()和messaging.onTokenRefresh()

https://firebase.google.com/docs/cloud-messaging/js/client