0
自過去15天以來,我一直在服務人員身上工作。它的學習速度相當快,但從那時起我就停留在我的網站上的通知支持上。推送通知即使在服務人員接收到推送事件,也不會顯示
我面臨的問題是即使在服務人員註冊的推送事件中收到通知,通知也不會顯示。
但是,當通過像pushcrew.com這樣的服務接收到其他桌面通知時,它會顯示,並且您單擊查看它,然後顯示我的通知。
<!DOCTYPE html>
<html>
<head>
<title></title>
<link rel="manifest" href="./manifest.json">
</head>
<body>
<script type="text/javascript">
window.onload = function(){
// console.debug("Onload");
navigator.serviceWorker
.register('./service-worker.js')
.then(function(registration){
console.log("registration");
registration.onupdatefound = function() {
var installingWorker = registration.installing;
installingWorker.onstatechange = function() {
switch (installingWorker.state) {
case 'installed':
if (navigator.serviceWorker.controller) {
// At this point, the old content will have been purged and the fresh content will
// have been added to the cache.
// It's the perfect time to display a "New content is available; please refresh."
// message in the page's interface.
location.reload(true);
}
else {
// At this point, everything has been precached.
// It's the perfect time to display a "Content is cached for offline use." message.
}
break;
case 'redundant':
console.error('The installing service worker became redundant.');
break;
case 'activating':
console.log("activating");
break;
case 'activated':
registration.pushManager.subscribe({
userVisibleOnly: true
}).then(function(sub) {
console.log('endpoint:', sub.endpoint);
document.write(sub.endpoint);
});
console.log("activated");
break;
default:
console.log("Default Condition" + installingWorker.state);
break;
}
}
};
})
.catch(function(err){
// alert("Service worker registration failed ");
});
}
</script>
</body>
</html>
的manifest.json
{
"name": "WorkIndia",
"short_name": "WorkIndia",
"icons": [{
"src": "icon-128x128.png",
"sizes": "128x128",
"type": "image/png"
}, {
"src": "icon-144x144.png",
"sizes": "144x144",
"type": "image/png"
}, {
"src": "icon-152x152.png",
"sizes": "152x152",
"type": "image/png"
}, {
"src": "icon-192x192.png",
"sizes": "192x192",
"type": "image/png"
}, {
"src": "icon-256x256.png",
"sizes": "256x256",
"type": "image/png"
}],
"permissions": [
"notifications"
],
"web_accessible_resources": [
"icon-128x128.png"
],
"start_url": "index.html",
"display": "standalone",
"background_color": "#3E4EB8",
"theme_color": "#2F3BA2",
"gcm_sender_id": "234031710894"
}
服務worker.js
'use strict';
self.addEventListener('push', function(event) {
// if (self.skipWaiting) { self.skipWaiting(); }
var notificationTitle = 'Hello';
var notificationOptions = {
body: 'Thanks for sending this push msg.',
tag: 'simple-push-demo-notification',
data: {
url: 'https://developers.google.com/web/fundamentals/getting-started/push-notifications/'
}
};
if (event.data) {
const dataText = event.data.text();
notificationTitle = 'Received Payload';
notificationOptions.body = "Push data: " + dataText;
}
console.debug('Received a push message', event);
event.waitUntil(
self.registration.showNotification(notificationTitle, notificationOptions)
);
});
self.addEventListener('notificationclick', function(event) {
console.log('On notification click: ', event.notification.tag);
// Android doesn’t close the notification when you click on it
// See: http://crbug.com/463146
event.notification.close();
// This looks to see if the current is already open and
// focuses if it is
event.waitUntil(clients.matchAll({
type: 'window'
}).then(function(clientList) {
for (var i = 0; i < clientList.length; i++) {
var client = clientList[i];
if (client.url === '/' && 'focus' in client) {
return client.focus();
}
}
if (clients.openWindow) {
return clients.openWindow('/');
}
}));
});
控制檯
(index):16 registration
(index):41 activating
(index):51 activated
(index):47 endpoint: https://android.googleapis.com/gcm/send/coiKeSkPta0:APA91bGUTJD6TciT1HANKGd…HqUEz5iQY7y9I_BVbDbPWIv0r7zfHyhlwFl91odzSIhr71IPXDK4ie6ok3yWTN-pflj16Vezq5
service-worker.js:20 Received a push message PushEvent {data: null, type: "push", target: ServiceWorkerGlobalScope, currentTarget: ServiceWorkerGlobalScope, eventPhase: 2…}bubbles: falsecancelBubble: falsecancelable: falsecomposed: falsecurrentTarget: ServiceWorkerGlobalScopedata: nulldefaultPrevented: falseeventPhase: 0path: Array[0]returnValue: truesrcElement: ServiceWorkerGlobalScopetarget: ServiceWorkerGlobalScopetimeStamp: 0type: "push"__proto__: PushEvent
我已經添加了gcm權限,並試圖嘗試刪除waitunitl,但似乎沒有任何工作。如果你有其他地方我可以找,請告訴我。 –
此外,有趣的部分是我看到通知時,出現一些其他桌面通知,然後我的網站通知也可見。我無能爲力,我失蹤了。我也嘗試過各種在線演示,他們也有同樣的問題。我認爲這更像是一些配置問題,然後是一個技術問題 –