google-chrome - Chrome 忽略 ETag header ，只使用内存缓存/磁盘缓存

Question

如果我理解正确，使用 ETag 的流程现在描述如下:

• 浏览器向服务器发送请求。服务器发回带有 ETag 的图像
• 浏览器将资源与 ETag 一起保存
• 在下一个请求中，浏览器发送带有包含保存的 ETag 的 header If-None-Match 的请求。

返回响应时，chrome 开发工具告诉我这些是我的 header

Cache-Control:max-age=7200
Connection:keep-alive
Content-Type:image/png
Date:Thu, 27 Apr 2017 13:42:57 GMT
ETag:"b36f59c868d4678033d318a182658e18371df8f5"
Expires:Thu, 27 Apr 2017 15:42:57 GMT
Server:nginx
Transfer-Encoding:chunked
X-Debug-Token:873c8f
X-Debug-Token-Link:http://localhost:8081/_profiler/873c8f

但是，现在，当我重新加载页面时，并没有收集到新图像。它是通过 Chrome 的内存缓存或磁盘缓存保存的，如您在此处所见

但为什么会这样呢？我发送了一个 ETag 那么为什么浏览器不向服务器发出另一个请求而是使用它自己的缓存？

我问的原因是，我们想要缓存我们的图像，但是一旦它们发生变化，它们就应该立即更新。为什么 Chrome 会这样做？

更新
我刚刚注意到它在 Firefox 上按预期工作，因此这似乎是 chrome 的“功能”而不是配置功能。<​​/p>

更新 2
像这样为图像设置新标题后

Cache-Control:max-age=0, private
Connection:keep-alive
Content-Type:image/png
Date:Thu, 27 Apr 2017 14:44:57 GMT
ETag:"e5b18bdebe44ed4bba3acb6584d9e6a81692ee27"
Expires:Fri, 27 Oct 2017 14:44:57 GMT
Server:nginx
Transfer-Encoding:chunked
X-Debug-Token:3447a6
X-Debug-Token-Link:http://localhost:8081/_profiler/3447a6

Chrome 仍然使用磁盘缓存来加载数据。这是我的 nginx

location ~* \.(?:jpg|jpeg|gif|png|ico|cur|gz|svg|svgz|mp4|ogg|ogv|webm|htc)$ {
  access_log off;
  add_header Cache-Control "max-age: 0, must-revalidate";
}

更新 3
我只是做了一些进一步的研究。一旦设置了 Expires 标签，Chrome 就会使用内存或磁盘缓存。与 max-age 相同。我不明白，即使设置了 must-revalidate，一旦设置了 Expires 或 max-age=>0， Chrome 不会重新加载资源。

Answer 1

服务器告诉 chrome 该资源在接下来的 2 小时(7200 秒)内可用。大概您的第二个请求早于此。

max-age: 0 或者 max-age: 0, must-revalidate 会更好。然后虽然你永远不会得到一个完全缓存的操作(甚至懒得去打服务器)你仍然可以让服务器发送 304 Not Modified 响应来告诉浏览器它可以使用缓存的实体(并根据 header 更新任何元数据(如果适用))因此，当您仍然有请求-响应发生时，只会发送大约 300 字节，而不是实体有多少千字节或更多。