Chrome拒绝缓存Javascript

时间:2014-07-16 09:43:11

标签: google-chrome caching nginx

我是浏览器缓存的新手。我正在尝试让Chrome使用查询参数永久缓存任何静态文件(用于缓存清除目的)。我已经将Cache-Control和Expires标头设置为未来,这应该足以说“永远缓存”。生成的响应标头:

HTTP/1.1 200 OK
Cache-Control: public, max-age=315360000
Connection: keep-alive
Content-Encoding: gzip
Content-Type: application/x-javascript
Date: Wed, 16 Jul 2014 09:29:54 GMT
Last-Modified: Wed, 16 Jul 2014 03:44:14 GMT
Server: nginx/1.6.0
Transfer-Encoding: chunked
Vary: Accept-Encoding

Firefox和Safari似乎都尊重所有cachebusted(?v =查询参数)文件。除了Javascript之外,Chrome主要遵循指令。大多数情况下,它使用If-Modified-Since标头执行请求,而不是从缓存加载。有时其中一个将从缓存加载而另一个将产生一个请求,结果为304.通常从新选项卡加载页面时,它将从缓存加载,但如果您在地址栏中按Enter键则不会加载。

Debugger

我观察过其他网站使用我认为完全相同的标题,并且文件总是从缓存中加载。即使您进行刷新,其中一些也会从缓存加载。

我理解缓存行为有些不可预测,但我想确保我不会监督那些让Chrome做到这一点的事情?

1 个答案:

答案 0 :(得分:2)

我对chrome有同样的问题,经过几个小时的试验和错误后,我发现,Chrome似乎与Vary Header有问题

我的Apache / .htaccess配置中有这个片段,一旦我评论“Header append Vary Accept-Encoding”这一行,Chrome就开始缓存.js和.css文件

  <FilesMatch "(\.js\.gz|\.css\.gz)$">
  # Serve correct encoding type.
  Header set Content-Encoding gzip
  # Force proxies to cache gzipped & non-gzipped css/js files separately.
  #Header append Vary Accept-Encoding
</FilesMatch>

在通过我们的nignx服务器运行请求时仍然无法正常工作,因为它在提供压缩的gzip时也添加了Vary:Accept-Encoding标头。

到目前为止,我可以猜测这是一个仅在Chrome中出现的问题,并且作为一种解决方法,我会更改配置以仅在chrome(未检查safari)不是客户端时附加标题,直到有更好的固定:

<FilesMatch "(\.js\.gz|\.css\.gz)$">
  # Serve correct encoding type.
  Header set Content-Encoding gzip
  # Force proxies to cache gzipped & non-gzipped css/js files separately.
  BrowserMatch "Chrome" ChromeFound
  Header append Vary Accept-Encoding env=!ChromeFound
</FilesMatch>