Работник службы не получает обновления автоматически в Прогрессивном веб-приложении

Question

Когда я меняю код в обслуживающем работнике, я ожидаю, что обновит предыдущего сотрудника службы в браузерах. Я прочитал, что любые изменения в service-worker.js автоматически обновляют его в браузер Это моя служба код работника:

var dataCacheName = 'demo-v5'; 

var filesToCache = [ 
    '/', 
    '/Home/Index', 
    '/Home/AboutUs' 
]; 
self.addEventListener('install', function (e) { 
    console.log('[Service Worker] Install'); 
    e.waitUntil(
     caches.open(dataCacheName).then(function (cache) { 
      console.log('[Service Worker] Caching app shell'); 
      return cache.addAll(filesToCache); 
     }) 
    ); 
}); 
self.addEventListener('activate', function(e) { 
    console.log('[ServiceWorker] Activated'); 
    caches.keys() 
    e.waitUntil(

     // Get all the cache keys (cacheName) 
     caches.keys().then(function(cacheNames) { 
      return Promise.all(cacheNames.map(function(thisCacheName) { 

       // If a cached item is saved under a previous cacheName 
       if (thisCacheName !== dataCacheName) { 

        // Delete that cached file 
        console.log('[ServiceWorker] Removing Cached Files from Cache - ', thisCacheName); 
        return caches.delete(thisCacheName); 
       } 
       else 
       { 
        console.log('Else- ', thisCacheName); 
       } 
      })); 
     }) 
    ); // end e.waitUntil 

    // return self.clients.claim(); 
}); 

self.addEventListener('fetch', function (e) { 
    console.log('[Service Worker] Fetch', e.request.url); 
    var dataUrl = 'https://query.yahooapis.com/v1/public/yql'; 
    if (e.request.url.indexOf(dataUrl) > -1) { 
     e.respondWith(
      caches.open(dataCacheName).then(function (cache) { 
       return fetch(e.request).then(function (response) { 
        cache.put(e.request.url, response.clone()); 
        return response; 
       }); 
      }) 
     ); 
    } else { 

     e.respondWith(
      caches.match(e.request).then(function (response) { 
       return response || fetch(e.request); 
      }) 
     ); 
    } 
}); 

Answer 1

изменения службы работника будет отражать во втором обновлении страницы. Если он не обновляется даже при втором обновлении, чем искать ошибки рабочего места в консоли разработчика Chrome (надеюсь, вы уже используете его). Он будет находиться под

Приложения -> Service Worker

в инструментах разработчика Chrome (последняя стабильная версия Chrome).

Откройте инструменты разработчика Chrome, нажав Ctrl + Shift + I или Right click -> Inspect Element.

ПРИМЕЧАНИЕ: Если вы хотите службы работник обновить на первом обновлении затем измените установки событие -

self.addEventListener('install', function (e) { 
    console.log('[Service Worker] Install'); 
    e.waitUntil(
     caches.open(dataCacheName).then(function (cache) { 
      console.log('[Service Worker] Caching app shell'); 
      return cache.addAll(filesToCache); 
     }).then(function(e){ 
     return self.skipWaiting(); 
     }) 
    ); 
}); 

Answer 2

Спасибо за ваш ответ. Фактическая проблема была с filesToCache .The корневой директории т.е. «/»

var filesToCache = [ 
// '/', 
'/Home/Index', 
'/Home/AboutUs' 
]; 

должны быть прокомментированы здесь. Мой класс service-worker также получал кеширование и каждый раз, когда он выбирал его из кеша после обновления.