javascript - 多虚拟目录站点中的服务 worker

Question

我很难理解服务人员的行为方式。我的域的根目录中有一个 Angular 渐进式 Web 应用程序。此文件夹包含所有 JavaScript 文件。然后我的每个客户端都有一个子文件夹，其中包含 index.html 文件、manifest.json 和一些与此客户端相关的图像。因此索引文件指向父文件夹中的 JavaScript 文件。

现在我想要一个 service worker，它在根目录中缓存 JavaScript 文件，在每个子文件夹中缓存索引文件。

目前我已将 service worker 放在根目录中，但对于每个客户端，它都会缓存我不想缓存的所有其他客户端文件。每当我需要创建一个新的子文件夹时，我都必须更新根目录中的 service worker。有没有办法让多个服务 worker ，每个子文件夹一个？ (我知道它不能获取父目录中的文件)

Answer 1

是的，您可以通过指定选项 scope 为不同的路径注册多个服务 worker 。

navigator.serviceWorker.register('/sw.js', {
  scope: '/path/to/folder1'
}).then(function(registration) {
  console.log('Service worker registration succeeded. This service worker will catch all http requests under /path/to/folder1');
});

navigator.serviceWorker.register('/sw.js', {
  scope: '/path/to/folder2'
}).then(function(registration) {
  console.log('Service worker registration succeeded. This service worker will catch all http requests under /path/to/folder2');
});

相关 MDN 文章。

https://developer.mozilla.org/en-US/docs/Web/API/ServiceWorkerContainer/register