小编nla*_*son的帖子

我咨询过很多关于服务工作者的资源:

• 更新ServiceWorker
• ServiceWorker:Web平台的革命
• 杰克阿奇博尔德可爱的SVGOMG.

但是,我不能为我的生活找出如何在安装新的ServiceWorker后更新页面.无论我做什么,我的页面都停留在旧版本上,只有硬刷新(Cmd-Shift-R)才能修复它.1)关闭标签,2)关闭Chrome或3)的组合location.reload(true)不会为新内容提供服务.

我有一个超级简单的示例应用程序,主要基于SVGOMG.在安装时,我使用缓存一堆资源cache.addAll(),skipWaiting()如果当前版本的主要版本号与活动版本的编号不匹配(基于IndexedDB查找),我也会这样做:

self.addEventListener('install', function install(event) {
  event.waitUntil((async () => {
    var activeVersionPromise = localForage.getItem('active-version');
    var cache = await caches.open('cache-' + version);
    await cache.addAll(staticContent);
    var activeVersion = await activeVersionPromise;
    if (!activeVersion ||
      semver.parse(activeVersion).major === semver.parse(version).major) {
      if (self.skipWaiting) { // wrapping in an if while Chrome 40 is still around
        self.skipWaiting();
      }
    }
  })());
});

我正在使用一个由semver启发的系统,主要版本号表示新的ServiceWorker无法热插拔旧的ServiceWorker.这适用于ServiceWorker端 - 从v1.0.0到v1.0.1的颠簸导致工作程序立即安装在刷新上,而从v1.0.0到v2.0.0,它等待选项卡关闭并重新打开安装.

回到主线程中,我在注册后手动更新了ServiceWorker - 否则页面甚至都没有得到可用的新版本ServiceWorker的备忘录(奇怪的是我发现在ServiceWorker文献中的任何地方都很少提及):

navigator.serviceWorker.register('/sw-bundle.js', {
  scope: './'
}).then(registration => …