![](/img/trans.png)
[英]Firebase Cloud Messaging's getToken() pending in Chrome Extension
[英]Firebase Cloud Messaging in a google chrome extension
我目前正在開發一個谷歌瀏覽器擴展,我需要在其中接收推送通知。 為此,我使用 Firebase 雲消息傳遞。
令牌已正確發送,我可以使用我在谷歌瀏覽器上收到的 postman 發送通知。
但是,onMessage 和 setBackgroundMessageHandler 永遠不會觸發,就像通知是完全獨立的。
這是我的代碼:
背景.js
chrome.runtime.onInstalled.addListener(function() {
if ('serviceWorker' in navigator) {
navigator.serviceWorker.register('../firebase-messaging-sw.js');
} else {
console.warn('Service workers aren\'t supported in this browser.');
}
firebase.initializeApp({
apiKey: "xx",
authDomain: "xx",
databaseURL: "xx",
projectId: "xx",
storageBucket: "xx",
messagingSenderId: "xx",
appId: "xx"
});
const messaging = firebase.messaging();
messaging.usePublicVapidKey("xx");
// WORK WELL
messaging.requestPermission()
.then(function() {
console.log("=== have permission ===");
return messaging.getToken();
})
.then(function(currentToken) {
console.log("Set token : ", currentToken);
chrome.storage.sync.set({fcmToken: currentToken}, function() {});
})
.catch(function(err) {
console.log("==== error ====", err);
});
messaging.onTokenRefresh(() => {
messaging.getToken().then((refreshedToken) => {
console.log("Refresh token : ", refreshedToken);
chrome.storage.sync.set({fcmToken: refreshedToken}, function() {});
}).catch((err) => {
console.log('Unable to retrieve refreshed token ', err);
});
});
//Never trigger
messaging.onMessage((payload) => {
chrome.browserAction.setBadgeText({text: "1"});
console.log('Message received. ', payload);
});
firebase-messaging-sw.js
importScripts('https://www.gstatic.com/firebasejs/7.14.0/firebase-app.js');
importScripts('https://www.gstatic.com/firebasejs/7.14.0/firebase-messaging.js');
firebase.initializeApp({
apiKey: "xx",
authDomain: "xx",
databaseURL: "xx",
projectId: "xx",
storageBucket: "xx",
messagingSenderId: "xx",
appId: "xx"
});
const messaging = firebase.messaging();
// NEVER TRIGGER
messaging.setBackgroundMessageHandler(function(payload) {
console.log('[firebase-messaging-sw.js] Received background message ', payload);
const notificationTitle = 'Background Message Title';
const notificationOptions = {
body: 'Background Message body.',
icon: '/firebase-logo.png'
};
return self.registration.showNotification(notificationTitle,
notificationOptions);
});
manifest.json
{
"manifest_version": 2,
"name": "app",
"description": "app",
"version": "0.0.3",
"permissions": [
"http://*/*",
"https://*/*",
"storage",
"notifications"
],
"web_accessible_resources": [
"js/popup.js",
"css/popup.css",
"html/popup.html",
"html/background.html",
"js/background.js"
],
"background": {
"page": "html/background.html",
"persistent": false
},
"options_page": "html/options.html",
"browser_action": {
"default_title": "Notification",
"default_popup": "html/popup.html",
"default_icon": {
"128": "img/get_started128.png"
}
},
"content_security_policy": "script-src 'self' https://www.gstatic.com/ https://*.firebaseio.com https://www.googleapis.com; object-src 'self'",
"icons": {
"128": "img/get_started128.png"
}
}
如果您有答案,非常感謝!
祝你有美好的一天,加賓
onMessage
和setBackgroundMessageHandler
僅在您從后台而不是在前台接收消息時觸發。
在文檔中,它提到您可以在兩個方面接收消息:前台,后台。
如果您想記錄/查看來自 service worker 的推送消息,您可以使用:
this.push(event)=>{
console.log(event.data)
}
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.