caching - 强制浏览器刷新缓存的图像

Question

我网站上的用户生成图像通过给他们一个 src 来提供。像这样:

userImage.ashx?id={UserId}&type=avatar

在来自 ashx 的回复中文件，我设置了 etag header 。当用户上传新图像时，etag 会发生变化。

如果浏览器缓存了一个带有 etag 的文件，它应该使用 If-None-Match 向服务器发送请求。每当需要显示该文件时，将 header 设置为该 etag。如果缓存的 etag 与服务器上当前的 etag 相同，则服务器响应 Not Modified - 304 .如果 etag 不同，服务器响应 OK - 200并开始发送新文件。

这就是它在理论上应该如何工作。但是，我发现对于某些浏览器(firefox 和 IE，在其他浏览器上未经测试)，情况并非如此。如果用户导航到带有缓存的、标记的图像的新页面，这些浏览器只需使用缓存中的图像而不发出请求。如果用户随后刷新页面，浏览器会发送一个带有 If-None-Match 的请求。 header 集。

所以我的问题是:用户更新他们的一个图像，然后导航到显示图像的页面。直到用户按下 refresh ，即使缓存图像与新图像具有不同的 etag，也会显示缓存图像。当用户按下刷新键时，浏览器会发出 If-None-Match 的请求。 header 集，触发服务器发送新图像。

有没有可能解决这个问题？

示例 200 响应头:

Status=OK - 200
Date=Thu, 27 Oct 2011 14:37:31 GMT
Server=Microsoft-IIS/6.0
X-Powered-By=ASP.NET
X-AspNet-Version=4.0.30319
Transfer-Encoding=chunked
Cache-Control=public, max-age=86400
Etag="27/10/2011 13:23:30"
Content-Type=image/jpg

示例 304 header :

Status=Not Modified - 304
Connection=close
Date=Thu, 27 Oct 2011 14:39:12 GMT
Server=Microsoft-IIS/6.0
X-Powered-By=ASP.NET
X-AspNet-Version=4.0.30319
Cache-Control=public, max-age=86400

(使用上次修改日期作为 etag，因为它更适合以后关于压缩等的需求。)

Answer 1

IIRC 您可以通过“Expires” header 设置文件的有效期。因此，如果您说“此文件在接下来的两天内有效”，则浏览器没有理由联系您的服务器。

你的例子中给出的 max-age 基本上做了同样的事情。