是否可以手动添加到服务工作者缓存？

Question

我正在尝试创建一个与服务工作者一起使用的接口，但它目前希望能够写入缓存本身。

如果不可能，知道在网络不可用时是否会使用过期的缓存资源会很有帮助。

编辑特别是Response 公共构造函数不允许指定正文数据，而Cache.put() 需要Response。

Answer 1

我正在尝试创建一个与 service worker 一起使用的接口，但它目前希望能够写入缓存本身。

Cache Storage API 在 Service Worker 内部很有用，但不仅限于 ServiceWorkerGlobalScope。在普通网页上也是exposedwindow.caches。因此，您可以从您的网页或服务工作者（或web worker，就此而言）读取和写入相同的缓存。

如果不可能，知道在网络不可用时是否会使用过期的缓存资源会很有帮助。

缓存存储 API 中没有“过期缓存资源”的概念。缓存的Response 中的Cache-Control 标头实际上会被忽略，如果这就是您要问的。因此，只要将Response 存储在缓存中，您就可以读取并使用它。但是不会自动使用任何东西——您需要专门设置服务工作者的fetch 事件处理程序并添加确定在各种场景中发生什么的逻辑。可以在“The Offline Cookbook”中找到有关如何编写服务工作者代码的良好通用概述。

例如，here's a fetch handler 将通过首先访问网络（通过 fetch()）来响应所有网络请求，如果拒绝，则尝试使用相同 URL 的缓存响应进行响应：

self.addEventListener('fetch', function(event) {
  event.respondWith(
    fetch(event.request).catch(function() {
      return caches.match(event.request);
    })
  );
});