Workbox Service Worker 的缓存在首次加载时似乎没有立即激活

Question

在使用 Workbox webpack 插件创建我的 service worker 时，我将 skipWaiting 和 clientsClaim 都设置为 true。在第一个初始加载时，没有先前的服务工作者运行，我看到我所有的预缓存资源都被初始登录页面上的 sw 加载（大概是放入缓存中）。其中一个资源，我们会说a.js，确实在网络选项卡中显示为在这些资源中加载。

然后，我浏览到使用 a.js 的 Web 应用程序的新部分，我确实在网络选项卡中看到了 a.js 加载，但 不是 来自服务工作者；它像往常一样从网络加载。似乎在第一次初始加载时，软件正在运行并缓存资源，但没有从缓存中提供服务。这是预期的行为吗？

需要明确的是，如果我清除所有服务人员，然后再次浏览到着陆页，然后刷新并重新加载着陆页，然后浏览到那个其他部分，我确实可以看到a.js 从缓存中加载，形成服务工作者。所以看起来 service worker 的初始安装并没有导致它完全活跃。

这是预期的，如果不是，有没有办法解决这个问题？

Answer 1

如果您使用clientsClaim 并且处于全新的场景中，则在服务工作人员完成安装/激活后，所有网络请求都应触发服务工作人员的fetch 处理程序。所以你看到的和我预期的不符。

您可以enable debugging in Workbox 看看在您建议的场景中是否记录了任何有用的信息。尤其要确保预缓存步骤已完成，并且在您发出 a.js 请求时已完全激活 Service Worker。

您还可以查看当前活动服务人员的受控客户端列表，并确认您打开的新选项卡在列表中：