移动浏览器上的服务工作者JavaScript出现问题

Question

这让我抓狂。我一直在尝试为一个网站实现推送通知，我找到了一个解决方案(Javascript API通知(。问题是：通知在移动设备上不起作用。

我读过关于服务人员的文章，我一直在使用这段代码向用户请求权限和其他一切，但它仍然不起作用。我不确定我是不是做错了什么。我读到它必须是一个https网站，但这似乎不是问题所在。我也尝试过push.js插件plugin.js，但到目前为止没有成功(即使他们网站上的插件演示在我的手机浏览器上运行(>gt；https://park-inside.nl/test/

"；设置通知"；按钮用于在等待时间低于所选时间时显示通知。所以，要测试这一点，只需点击"；设置通知"；，则选择大于"0"的分钟；Wachttijd"；列和刷新页面。应显示通知。它适用于桌面浏览器，但不适用于移动设备。有什么想法或建议吗？我愿意并感谢任何帮助。

注意：我在Android 9上使用Chrome 94(go(

请求用户权限的代码：

Notification.requestPermission(function(result) {
if (result === 'granted') {
navigator.serviceWorker.ready.then(function(registration) {
registration.showNotification('Notification with ServiceWorker');
});
}
});

Answer 1

请参阅Web通知的浏览器支持表：https://caniuse.com/notifications.

它们只能在安卓系统的Chrome浏览器中使用，而不能在现有的安卓浏览器中使用。

此外，一定要注册一名服务人员，即使是空的，如图所示：https://stackoverflow.com/a/31787926/10551293.

此处提供通知演示：https://serviceworke.rs/push-payload_demo.html.

谷歌还提供了一个循序渐进的代码实验室：https://developers.google.com/codelabs/pwa-training/pwa03--going-offline#0

Answer 2

显然，我必须首先注册一个服务工作者：

if ('serviceWorker' in navigator) {
navigator.serviceWorker.register('sw.js');
}

我真的不确定，但我试图为sw.js文件使用一个路由，比如：js/sw.js。一旦我把这个文件放在项目的根目录中，它就工作了。

此外，我将此代码添加到该文件中，以将一些事件记录到控制台：

self.addEventListener('install', (event) => {
console.log('Installed');
});
self.addEventListener('activate', (event) => {
console.log('Activated');
});
self.addEventListener('fetch', (event) => {
console.log('Fetch request');
});

感谢swift lynx提供了一些文档的链接，在那里我找到了一个解决方案：

https://developers.google.com/web/ilt/pwa/introduction-to-push-notifications