需要有关在域中使用多服务工作者的信息

Question

我有一个 PWA 网站并有自己的 service-worker.js 文件用于缓存。出于某些原因，我想在我的网站上使用推送通知服务。我应该知道这些问题的答案：

1) 如何在网站根目录下使用多服务工作者？

2) 我可以使用一个 service worker 文件并在上面放两个 importscript 两个 service worker 吗？

3) 我可以使用假作用域来注册 service worker 吗？（我的意思是使用范围，但它不在我的网站路径中。）

4) 如果我使用 importscript，我的老用户是否仍然可以使用缓存？

我尝试在网站的根目录中使用一个 service-worker，并像这样在这个 service worker 文件中使用 importscript：

importScripts('https://cdn.onesignal.com/sdks/OneSignalSDKWorker.js');
importScripts('service-worker.js');

我收到推送通知，一切正常，但我不知道我的旧用户缓存文件是否仍然可用？

此外，我尝试将它们都用于注册范围，但是 navigator.serviceWorker.ready (promise) 订阅总是在 pending:

navigator.serviceWorker.register('/service-worker.js', {scope: '/fake'})
        .then((registration) => {
          console.log('ServiceWorker registration successful.', registration)
          return navigator.serviceWorker.ready
        })
        .catch(error => {
          console.error('ServiceWorker registration failed.', error)
        })

console:

navigator.serviceWorker.ready = Promise {<pending>}
__proto__: Promise
[[PromiseStatus]]: "pending"
[[PromiseValue]]: undefined

Answer 1

我会尽量回答你的问题:

1) 如何在网站根目录中使用 multi-service worker？

您只能让一个服务工作者在指定范围内按站点注册：因此在 / 范围内只能有一个服务工作者，但是您可以在站点的每个范围内添加一个服务工作者（即：一个在 / 和 /user 上的一个）但如果需要，您可以将 2 个 service worker 合并为一个。

2) 我可以使用一个 service worker 文件，然后在上面放两个 service worker 的两个 importscript 吗？

是的，你可以这样做，你可以放置任意数量的 eventListener，它们按声明顺序执行，但要小心，除非 javascript 中的 require，所有脚本导入与 importScripts() 共享相同的范围，因此如果单个脚本共享一些变量名，它们可能会遇到一些问题。

3) 我可以使用一个虚假的作用域来注册 service worker 吗？（我的意思是使用范围，但它不在我的网站路径中。）

你可以，但是 SW 的范围决定了它的执行上下文，所以它将加载到你的 computer/phone 但它只会在它的范围内根据请求有效，如果你在它下面的页面上（ website.com/fake 或 website.com/fake/whateverelse) 或者如果您在此范围内调用资源 (website.com/fake/style.css)

4) 如果我使用 importscript，我的老用户是否仍然可以使用缓存？

这取决于您在 install 和 activate 阶段所做的事情。安装新的 SW 或它的新版本不会清除缓存，除非您在代码中明确地这样做。

需要有关在域中使用多服务工作者的信息

Need information about using multi service-worker in a domain

javascript

push-notification

service-worker

web-push