如何在不按 F5 的情况下使缓存图像过期？答案

【问题标题】：How do I expire a cached image without hitting F5?如何在不按 F5 的情况下使缓存图像过期？
【发布时间】：2012-11-02 09:24:01
【问题描述】：

我正在使用 MVC4 和 C# 制作一个 Web 应用程序。

我允许用户为他们的个人资料图片上传图片。此时，我需要之前的个人资料图片过期，以便在浏览器重新加载页面时显示新图片。目前，由于两个图像共享相同的名称，浏览器使用已缓存的前一个图像而不是新图像。

如果我用 F5 强制浏览器重新加载，它会显示新图像。如何确保返回其个人资料页面的用户在不按 F5 的情况下看到新图像而不是浏览器缓存中的图像？

【问题讨论】：

【解决方案1】：

在服务器上存储图像时，在文件名中添加（静态）位随机文本，并在图像更改时重新生成。这样，浏览器将在图像相同时缓存图像，并在图像更改时重新加载，从而提供所需的行为，而不会增加不必要的页面加载时间。

【讨论】：

【解决方案2】：

您可以在图像文件名的末尾添加一个虚拟参数。例如，

<img src="...\avatar.jpg?d=7615833">

其中数字是随机的或时间戳。它将被忽略，但存在会强制浏览器重新加载图像。

【讨论】：

那为什么不使用no-cache呢？随机参数很丑
如果他想防止图像重新加载，他不是每次都必须添加相同的数字吗？
可能使用文件的更改日期或其内容的哈希值。
无缓存是“正确”的方式，但我发现浏览器非常固执地拒绝根据说明缓存/不缓存。图片 url 上的标签既快又脏，但可行。 Niko 是对的，随机数会在每次显示时强制重新加载；可重现的东西更好，例如文件创建时间或简单的版本计数器。