如何使用 Workbox 实施“先缓存后网络”策略

Question

我正在尝试使用 Workbox 实施 'cache then network' 策略。

我已将 Workbox 设置为使用 staleWhileRevalidate runtimeCaching 处理程序，但我不确定如何最好地更新页面一次/如果我们从网络更新缓存。

文档说：

除了更新适当的缓存外，它还会触发底层 RequestWrapper 中定义的任何适当的插件。

这样有用吗？是否有任何使用 Workbox 完成此策略的示例（顺便说一下，这是一个很棒的工具，所以感谢它的维护者）？

Answer 1

https://workbox-samples.glitch.me/examples/workbox-broadcast-cache-update/ 上有一个以“独立”方式使用 BroadcastCacheUpdate 功能的示例

要通过 WorkboxSW 的路由将其与 staleWhileValidate 一起使用，您可以执行以下操作：

workboxSW.router.registerRoute(
  new RegExp('/some/path/prefix'),
  workboxSW.strategies.staleWhileRevalidate({
    cacheName: 'my-cache',
    broadcastUpdate: {
      channelName: 'my-update-channel'
    },
  })
);

你可以在the docs看到一个完整的例子。