Chrome不重新启动服务工作人员进行推送通知
我正在将FCM推送通知集成到我的角度应用中,并且服务工作者(SW)已成功注册在Chrome中,如下所示:
安装状态是激活的
,如果我手动开始
SW,我确实会收到推送通知它发现它不需要优化,但在推送通知时切勿重新启动它。因此,我们的客户关闭我们的网站后无法获得通知。我正在使用:
- Angular
v13
- chrome
v102.0.5005.61
以下是我SW的片段用于收听'push'
事件:
importScripts('./assets/js/async-waituntil.js');
importScripts('https://cdn.jsdelivr.net/gh/mozilla/localForage@master/dist/localforage.js');
importScripts('https://www.gstatic.com/firebasejs/8.2.6/firebase-app.js');
importScripts('https://www.gstatic.com/firebasejs/8.2.6/firebase-messaging.js');
(function () {
'use strict';
self.addEventListener('install', function (event) {
self.skipWaiting();
});
self.addEventListener('activate', (event) => {
event.waitUntil(clients.claim());
});
removeAllEventListener('push');
self.addEventListener('push', (msg) => {
const itsGonnaBeLegendary = new Promise((resolve, reject) => {
let data = null;
if (msg && msg.data && msg.data.json()) {
data = msg.data.json();
}
if (data === null) {
resolve();
}
if (data.data && data.data['event'] && data.data['event'] === 'logout') {
const firebaseConfig = {
apiKey: '****',
authDomain: '****',
projectId: '****',
storageBucket: '****',
messagingSenderId: '****',
appId: '****',
};
firebase.initializeApp(firebaseConfig);
const messaging = firebase.messaging();
return messaging.deleteToken();
}
if (!msg.data) {
resolve();
return;
}
self.clients
.matchAll()
.then((client) => {
try {
if (client.length > 0) {
try {
client[client.length - 1].postMessage(data);
} catch (e) {
resolve();
return;
}
}
let url = '';
localforage
.getItem('user')
.then((userdata) => {
const user = JSON.parse(userdata);
if (data.data) {
const gcmData = data.data;
url = gcmData.url;
if (gcmData.type === 'note' && !gcmData.notify.split(',').includes(user.name)) {
resolve();
return;
}
}
self.clients
.matchAll({
type: 'window',
includeUncontrolled: true,
})
.then(function (windowClients) {
try {
let isVisible = false;
if (
windowClients.length > 0 &&
windowClients.findIndex((x) => x.url.includes('hello')) > -1
) {
isVisible = true;
} else {
isVisible = false;
}
if (!isVisible) {
const desc = data.notification;
let options = {
data: { url },
};
self.registration
.showNotification(desc['title'], options)
.then(() => {
resolve();
return;
})
.catch((e) => {
resolve();
return;
});
}
} catch (e) {
resolve();
}
})
.catch((e) => {
resolve();
return;
});
})
.catch((e) => {
resolve();
return;
});
} catch (e) {
resolve();
return;
}
})
.catch((e) => {
resolve();
return;
});
});
msg.waitUntil(itsGonnaBeLegendary);
});
self.addEventListener('notificationclick', (event) => {
event.notification.close();
var promise = new Promise(function (resolve) {
if (clients.openWindow && event.notification.data.url) {
clients.matchAll().then(function (clientsArr) {
const client = clientsArr.find(
(c) =>
c.url.includes('custom-url') ||
c.url.includes('custom-url-1')
);
if (client) {
resolve(client.focus());
} else {
resolve(clients.openWindow(event.notification.data.url));
}
});
}
}).then((x) => {
return x;
});
event.waitUntil(promise);
});
})();
官方文档说,当正确的事件发生正确的事件时,浏览器将自动重新启动SW,但无法正常工作。请帮忙。
I am integrating FCM push notifications in my Angular application and the Service Worker (SW) is successfully registered in Chrome as can be seen below:
The installation status is ACTIVATED
and I do receive push notifications if I manually Start
the SW but the issue is Chrome stops the SW as soon as it finds it unneeded for optimization but never restarts it in the event of push notification. Due to this, our clients are not able to get the notification after they close our website. I am using:
- Angular
v13
- Chrome
v102.0.5005.61
Below is the snippet of my SW that we are using to listen for 'push'
event:
importScripts('./assets/js/async-waituntil.js');
importScripts('https://cdn.jsdelivr.net/gh/mozilla/localForage@master/dist/localforage.js');
importScripts('https://www.gstatic.com/firebasejs/8.2.6/firebase-app.js');
importScripts('https://www.gstatic.com/firebasejs/8.2.6/firebase-messaging.js');
(function () {
'use strict';
self.addEventListener('install', function (event) {
self.skipWaiting();
});
self.addEventListener('activate', (event) => {
event.waitUntil(clients.claim());
});
removeAllEventListener('push');
self.addEventListener('push', (msg) => {
const itsGonnaBeLegendary = new Promise((resolve, reject) => {
let data = null;
if (msg && msg.data && msg.data.json()) {
data = msg.data.json();
}
if (data === null) {
resolve();
}
if (data.data && data.data['event'] && data.data['event'] === 'logout') {
const firebaseConfig = {
apiKey: '****',
authDomain: '****',
projectId: '****',
storageBucket: '****',
messagingSenderId: '****',
appId: '****',
};
firebase.initializeApp(firebaseConfig);
const messaging = firebase.messaging();
return messaging.deleteToken();
}
if (!msg.data) {
resolve();
return;
}
self.clients
.matchAll()
.then((client) => {
try {
if (client.length > 0) {
try {
client[client.length - 1].postMessage(data);
} catch (e) {
resolve();
return;
}
}
let url = '';
localforage
.getItem('user')
.then((userdata) => {
const user = JSON.parse(userdata);
if (data.data) {
const gcmData = data.data;
url = gcmData.url;
if (gcmData.type === 'note' && !gcmData.notify.split(',').includes(user.name)) {
resolve();
return;
}
}
self.clients
.matchAll({
type: 'window',
includeUncontrolled: true,
})
.then(function (windowClients) {
try {
let isVisible = false;
if (
windowClients.length > 0 &&
windowClients.findIndex((x) => x.url.includes('hello')) > -1
) {
isVisible = true;
} else {
isVisible = false;
}
if (!isVisible) {
const desc = data.notification;
let options = {
data: { url },
};
self.registration
.showNotification(desc['title'], options)
.then(() => {
resolve();
return;
})
.catch((e) => {
resolve();
return;
});
}
} catch (e) {
resolve();
}
})
.catch((e) => {
resolve();
return;
});
})
.catch((e) => {
resolve();
return;
});
} catch (e) {
resolve();
return;
}
})
.catch((e) => {
resolve();
return;
});
});
msg.waitUntil(itsGonnaBeLegendary);
});
self.addEventListener('notificationclick', (event) => {
event.notification.close();
var promise = new Promise(function (resolve) {
if (clients.openWindow && event.notification.data.url) {
clients.matchAll().then(function (clientsArr) {
const client = clientsArr.find(
(c) =>
c.url.includes('custom-url') ||
c.url.includes('custom-url-1')
);
if (client) {
resolve(client.focus());
} else {
resolve(clients.openWindow(event.notification.data.url));
}
});
}
}).then((x) => {
return x;
});
event.waitUntil(promise);
});
})();
The official docs say that SW will be restarted automatically by the browser when the right event occurs for the SW but can't get this to work. Please help.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论