Service Worker 更新事件触发器

Question

按照此链接https://github.com/deanhume/pwa-update-available，我正在尝试实施服务工作者更新，但我面临诸如事件更新未触发之类的问题，我认为这与我的应用程序设计，基本上是一个 SPA，意味着我总是在 index.html 上，它的行为类似于 app-shell，我正在推送内容区域中的内容，具体取决于单击的按钮。只有其他页面是 login/index.htmlapp.js 安装/更新 service worker 的内容是这样的：let newWorker;          function showUpdateBar() {            let snackbar = document.getElementById('snackbar');            snackbar.className = 'show';          }          // The click event on the pop up notification          document.getElementById('reload').addEventListener('click', function(){            newWorker.postMessage({ action: 'skipWaiting' });          });          if ('serviceWorker' in navigator) {            navigator.serviceWorker.register('/pwa/sw.js').then(reg => {              console.log( 'ServiceWorker registration successful with scope: ', registration.scope );              reg.addEventListener('updatefound', () => {                // A wild service worker has appeared in reg.installing!                newWorker = reg.installing;                newWorker.addEventListener('statechange', () => {                  // Has network.state changed?                  switch (newWorker.state) {                    case 'installed':                      if (navigator.serviceWorker.controller) {                        // new update available                        showUpdateBar();                      }                      // No update available                      break;                  }                });              });            });            let refreshing;            navigator.serviceWorker.addEventListener('controllerchange', function () {              if (refreshing) return;              window.location.reload();              refreshing = true;            });          }  所以基本上我面临的问题是触发更新，当我将 v28 等版本号更改为 v29 并重新加载页面时，我收到提示，但即使我注销、登录或退出也没有收到提示并重新打开应用程序。我该如何解决这个问题？

Answer 1

您只有在浏览器中加载 index.html 时才会触发服务工作者注册例程。这是唯一一次执行代码。

除非你定期轮询你的服务器或者可能打开一个 websocket（为此有点昂贵）你不会知道是否有新的 service worker 可用。您可以让用户注册推送通知....为此太头疼了。

因此，每隔几小时或几天就汇集一次服务器以进行更新。

如果有更新，您可以触发更新例程。

我会将轮询逻辑放在实际的 Service Worker 代码中，以使其远离 UI，如果您是 SPA，那么您已经锁定了 UI 线程，哈哈。

有很多方法可以给这只猫剥皮，setTimeout(..., {lots of seconds})，当服务工作者从休眠中醒来时，等等。

如果您可以发出 HEAD 请求，将网络流量保持在最低水平。

如果有更新，您可以向 UI 发布消息以更新 Service Worker。

这不是我所说的琐碎代码。我做了类似的事情来保持我缓存的资产是最新的，所以我一直在那里:)