javascript - Service Worker 似乎没有更新

Question

我正在关注以下关于 service worker 的 html5 rocks 教程 ( http://www.html5rocks.com/en/tutorials/service-worker/introduction/#disqus_thread )，但我遇到了我的 service worker 不想更新的问题。

我有一个名为“app.js”的文件，其中包含以下代码:

navigator.serviceWorker.register('worker.js').then(function(reg) {
  console.log('◕‿◕', reg);
}, function(err) {
  console.log('ಠ_ಠ', err);
});

我还有一个名为“worker.js”的文件，其中包含以下代码:

console.log("SW startup");
var myCache = 'myapp-static-v3';
var urlsToCache = [ 
  '/',
  '/assets/style.css',
  'app.js'
];

self.addEventListener('install', function(event) {
  console.log("SW installed");
  // pre cache a load of stuff:
  event.waitUntil(
    caches.open(myCache).then(function(cache) {
      console.log("opened cache");
      return cache.addAll(urlsToCache);
    })
  )
});

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

  var cacheWhitelist = [myCache];

   event.waitUntil(
    caches.keys().then(function(cacheNames) {
      return Promise.all(
        cacheNames.map(function(cacheName) {
          if (cacheWhitelist.indexOf(cacheName) === -1) {
            return caches.delete(cacheName);
          }
        })
      );
    })
  );
});

self.addEventListener('fetch', function(event) {
  event.respondWith(
    caches.match(event.request)
      .then(function(response) {
        // Cache hit - return response
        if (response) {
          return response;
        }

        var fetchRequest = event.request.clone();

        return fetch(fetchRequest).then(
          function(response) {
            // Check if we received a valid response
            if(!response || response.status !== 200 || response.type  !== 'basic') {
              return response;
        }

        var responseToCache = response.clone();

        caches.open(CACHE_NAME)
          .then(function(cache) {
            cache.put(event.request, responseToCache);
          });

        return response;
      }
    );
  })
);
});

我尝试更新实际的 myCache 变量名称，将 style.css 切换为不同的文件并实际更改内容。

有人知道我做错了什么吗？

Answer 1

根据文档，必须更改服务 worker 的实际文件。我在 service worker 更新中所做的是更改版本号。在您的情况下，它可能是 var myCache = 'myapp-static-v3';

你可以做一些类似语义版本控制的事情。
var myCache = 'myapp-static-v3.0.0' 然后升级到 var myCache = 'myapp-static-v3.0.1';