服务工作者：使特定的缓存响应无效

Question

当POST ， PUT或DELETE到相同的url或资源或集合'ur'的任何url时，我想要从我的服务工作者中使以前缓存的GET无效，例如：

假设我缓存/subscriptions ，稍后我会对/subscriptions执行POST以添加新订阅，或者说我PUT到/subscriptions/243以更新现有订阅。 这意味着我的缓存订阅集合现在是陈旧数据，我想从缓存中删除它，以便下一个请求将转到服务器。

我想到了两个选项，我不确定是否可能：

我可以在caches.match()调用中使用Regexp吗？

这样我就可以将请求的url的父集合片段与缓存中找到的键匹配。

我可以获取每个缓存数据响应的密钥吗？

如果是这样，我可以遍历每个响应，看看密钥是否符合我删除它的标准。

有任何想法吗？ 谢谢！

Answer 1

在通过caches.match()进行查找时，不能使用RegExp或字符串匹配以外的任何内容（可选地忽略查询参数 caches.match() 。

我建议使用第二种方法，在其中打开命名缓存， 获取其密钥 ，然后筛选您关心的缓存。 这不是那么多代码，并且使用await / async看起来相当不错：

async function deleteCacheEntriesMatching(cacheName, regexp) {
  const cache = await caches.open(cacheName);
  const cachedRequests = await cache.keys();
  // request.url is a full URL, not just a path, so use an appropriate RegExp!
  const requestsToDelete = cachedRequests.filter(request => request.url.match(regexp));
  return Promise.all(requestsToDelete.map(request => cache.delete(request)));
}

// Call it like:
await deleteCacheEntriesMatching('my-cache', new RegExp('/subscriptions'));