为什么服务工作者的 self.addEventListener 在 angularjs 中不起作用

Question

我现在尝试在我的 angularjs 项目中首先使用 service-worker 作为离线。我的项目由自耕农搭建脚手架，将这些行放在 service-worker 中，如下所示。

self.addEventListener('install', function(e) {
  e.waitUntil(
    caches.open(cacheName).then(function(cache) {
      console.log('[ServiceWorker] Caching App Shell');
      return cache.addAll(filesToCache);
    })
  );
});

并按如下方式调用并注册 service-worker index.jade

script.
    if('serviceWorker' in navigator) {
        navigator.serviceWorker
            .register('app/service-worker.js')
            .then(function() { 
                console.log('Service Worker Registered'); 
            })
            .catch(function(err) {
                console.log('ServiceWorker registration failed: ', err);
            });
    }

我收到了Service Worker Registered消息，但问题是addEventListener服务工作者在应用程序运行时不会被解雇。

self.addEventListener('install', function(e) 

self.addEventListener('activate', function(event) {

self.addEventListener('fetch', function(e) {

请帮我解决我错过的代码。

Answer 1

您注册的 Service Worker 位于app/service-worker.js，这意味着您的 Service Worker的有效范围是app/。只有位于其下的页面app/才会由该服务工作者控制。

您应该确保您注册的 Service Worker 文件是从对应于您需要的最大范围的路径提供的。如果您将service-worker.js文件向上移动一个路径级别，并将其注册为service-worker.js而不是app/service-worker.js，则其有效范围将包含当前页面以及从子路径提供的任何页面。