使用PWABuilder的Cache-first网络服务工永远不会更新？

Question

我正在使用PWABuilder的服务工作程序 PWABuilder 为我的网站 https:/digimoncard.io..

该 缓存优先网络 service worker JS文件包含以下代码。

// This is the service worker with the Cache-first network

const CACHE = "pwabuilder-precache";

importScripts('https://storage.googleapis.com/workbox-cdn/releases/5.0.0/workbox-sw.js');

self.addEventListener("message", (event) => {
  if (event.data && event.data.type === "SKIP_WAITING") {
    self.skipWaiting();
  }
});

workbox.routing.registerRoute(
  new RegExp('/*'),
  new workbox.strategies.CacheFirst({
    cacheName: CACHE
  })
);

然后我在index.php文件的body下有以下代码。

<!-- PWA -->
<script type="module">
import 'https://cdn.jsdelivr.net/npm/@pwabuilder/pwaupdate';

const el = document.createElement('pwa-update');
document.body.appendChild(el);    
</script>
<!-- END PWA -->

服务工作者似乎永远不会更新？无论我在任何页面上改变什么（内容、文件版本等），如果已经被缓存，服务工作者都不会更新。我可以通过清除浏览器缓存来手动解决这个问题，但我要么是遗漏了什么，要么是有意为之？比如我手机上访问的版本，已经有2天的内容过期了。

Answer 1

这是使用cache-first策略时的预期行为。假设缓存中存在匹配，那就是将使用的响应。

如果你正在寻找 "如果存在，使用缓存响应，但也在后台更新 "的方法，你可以切换到stale-while-revalidate策略。

Workbox开箱即用所支持的策略的完整列表可以在下面找到 https:/developers.google.comwebtoolsworkboxmodulesworkbox-strategies。