Chrome：强制重新加载图片

Question

为了刷新缓存的图片，我尝试了多种方法： 例如清除localStorage和sessionStorage。发送Clear-Site-Data头部也无法从浏览器中清除缓存的图片。 location.reload(true)已经被弃用了。这里也没有帮助到我。

但是不幸的是，我仍然收到旧的图片。

我想要实现Chrome的“清空缓存和强制刷新”功能。

我不想采用使图像URL变得唯一的方式，因为它在50多个地方引用了同一张图像。

- Kanti

---

这个回答解决了你的问题吗？在JavaScript中清除缓存 - Justinas

这个回答解决了你的问题吗？禁用Chrome缓存进行网站开发 - Jax-p

没有@Justinas，上面的问题没有解决我的问题。 - Kanti

@Jax-p 我不想禁用缓存。 - Kanti

Answer 1

请查看Cache.delete() Web API

https://developer.mozilla.org/en-US/docs/Web/API/Cache/delete

这段示例代码可能会删除所有缓存项。试一试吧。

caches.open('v1').then(function(cache) {
  cache.keys().then(function(keys) {
    keys.forEach(function(request, index, array) {
      cache.delete(request);
    });
  });
})

- Ozgur Sar

---

我从这里添加了示例代码，但没有尝试过。https://developer.mozilla.org/en-US/docs/Web/API/Cache/keys - Ozgur Sar

这也没有帮助：caches.keys().then((keyList) => Promise.all(keyList.map((key) => caches.delete(key)))) - Kanti

我找到了另一种可能清除缓存、Cookie等的方法。当使用https://example.com/clear的响应时，以下标头将导致与源https://example.com相关联的所有Cookie、缓存和DOM可访问存储被清除，以及相同源的执行上下文被中和并重新加载： Clear-Site-Data: "*" https://www.w3.org/TR/clear-site-data/ - Ozgur Sar

最终 “Clear-Site-Data”: “cache” 头信息生效了。之前我传递的是没有双引号的 cache。我发现这个答案很有帮助，但因为 VPN 而无法显示图片，而该答案在图片中。参考 https://dev59.com/cVQJ5IYBdhLWcg3wSTx1。 - Kanti

清除站点数据头能否以某种方式包含在网页的HTML源代码中？ - David.P