Chrome拒绝缓存Javascript [英] Chrome refuses to cache Javascript
问题描述
我对浏览器缓存很合适。我试图让Chrome浏览器使用查询参数永久缓存任何静态文件(用于缓存清除目的)。我已经将Cache-Control和Expires头文件设置为未来,这应该足以说永远缓存。产生的响应头文件:
HTTP / 1.1 200 OK
Cache-Control:public,max-age = 315360000
连接:keep-alive
内容编码:gzip
内容类型:application / x-javascript
日期:2014年7月16日星期三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 =查询参数)文件都表示尊重。 Chrome主要遵循指令,除了Javascript。大多数情况下,它使用If-Modified-Since标头执行请求,而不是从缓存中加载。有时候,其中一个会从缓存中加载,另一个会产生一个导致304的请求。通常,当从新选项卡加载页面时,它将从缓存中加载,但如果您在地址栏中输入,则不会。
我观察到其他网站使用我认为完全相同的标题,并且文件始终从缓存中加载。我知道缓存行为有点不可预知,但我想确保我不会监督正在做的事情Chrome做到了这一点?
我在chrome中遇到了同样的问题,经过几个小时的试验和错误,我发现,似乎有一个与Vary Header的问题
我在我的Apache / .htaccess配置中有这个片段,并且只要我评论这行Header append Vary Accept -EncodingChrome开始缓存.js和.css文件
< FilesMatch(\.js\.gz | \.css\.gz)$>
#服务正确的编码类型。
头文件集内容编码gzip
#强制代理缓存gzipped&非gzip的CSS / JS文件分开。
#Header append Vary接受编码
< / FilesMatch>
在通过我们的nignx服务器运行请求时,它仍然不起作用,因为它添加了Vary: Accept-Encoding header,当提供gzip压缩时。
到目前为止,我可以猜测这是一个只会发生在Chrome上的问题,作为一种解决方法,我会将配置更改为只有在chrome(没有检查过safari)不是客户端之前追加标题,直到有更好的解决方案:
<< ; FilesMatch(\.js\.gz | \.css\.gz)$>
#服务正确的编码类型。
头文件集内容编码gzip
#强制代理缓存gzipped&非gzip的CSS / JS文件分开。
BrowserMatchChromeChromeFound
标题附加内容Vary Accept-Encoding env =!ChromeFound
I am reasonably new to browser caching. I am attempting to get Chrome to permanently cache any static file with a query parameter (for cache busting purposes). I have set Cache-Control and Expires headers way into the future, which should be adequate to say "cache this forever". The resulting response headers:
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 and Safari seem to respect this for all cachebusted (?v= query parameter) files. Chrome mostly follows the directives, except for Javascript. Most of the time it does a request with an If-Modified-Since header rather than loading from cache. Sometimes one of them will load from cache and the other will yield a request resulting in a 304. Usually when loading the page from a new tab it will load from cache, but not if you hit enter in the address bar.
I've observed other websites using what I think are the exact same headers, and the files are always loaded from cache. Some of them load from cache even if you do a refresh.
I understand cache behaviour is somewhat unpredictable, but I want to make sure I'm not overseeing something that's making Chrome do that?
I had the same issue with chrome and after some hours of trial and error I figuered out, that chrome seems to have a problem with the Vary Header
I've got this snippet in my Apache / .htaccess config and as soon as I comment the line "Header append Vary Accept-Encoding" Chrome starts caching .js and .css files
<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>
It still does not work while running the request via our nignx server, because it is adding the Vary: Accept-Encoding header too, when delivering gzip compressed.
So far I can guess this is a problem that only happens with chrome and as a workaround I would change the configuration to append the header only if chrome (haven't checked for safari) is not the client until there is a better fix:
<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>
这篇关于Chrome拒绝缓存Javascript的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!