Chrome 没有缓存 JS 和 CSS答案

【问题标题】：Chrome is not caching JS and CSSChrome 没有缓存 JS 和 CSS
【发布时间】：2015-11-12 22:37:21
【问题描述】：

我正在运行 expressjs 服务器并在 Chrome 和 Firefox 中测试缓存。标题显示在问题之后。

谁能告诉我为什么 Chrome 不缓存 JS 和 CSS 文件？
如何让 Chrome 缓存文件？

Chrome 请求标头（初始和重复）：

GET /js/app.js HTTP/1.1
Host: 10.64.30.105
Connection: keep-alive
Accept: */*
User-Agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/46.0.2490.80 Safari/537.36
Referer: https://10.64.30.105/
Accept-Encoding: gzip, deflate, sdch
Accept-Language: en-US,en;q=0.8,zh-CN;q=0.6,zh;q=0.4

Chrome 响应标头（初始和重复）：

HTTP/1.1 200 OK
Access-Control-Allow-Origin: 
Access-Control-Allow-Credentials: 
Access-Control-Allow-Methods: 
Access-Control-Allow-Headers: 
Accept-Ranges: bytes
Date: Thu, 12 Nov 2015 22:16:57 GMT
Cache-Control: public, max-age=31536000
Last-Modified: Thu, 12 Nov 2015 16:02:47 GMT
ETag: W/"XsMH2eh+CkXmU96uopajGg=="
Content-Type: application/javascript
Vary: Accept-Encoding
Content-Encoding: gzip
Connection: keep-alive
Transfer-Encoding: chunked

相同的请求被缓存在 Firefox 中。

Firefox 初始请求标头：

GET /js/app.js HTTP/1.1
Host: 10.64.30.105
User-Agent: Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:42.0) Gecko/20100101 Firefox/42.0
Accept: */*
Accept-Language: en-US,en;q=0.5
Accept-Encoding: gzip, deflate
Referer: https://10.64.30.105/
Connection: keep-alive
Pragma: no-cache
Cache-Control: no-cache

Firefox 初始响应标头：

HTTP/1.1 200 OK
Accept-Ranges: bytes
Date: Thu, 12 Nov 2015 22:30:27 GMT
Cache-Control: public, max-age=31536000
Last-Modified: Thu, 12 Nov 2015 16:02:47 GMT
Etag: W/"XsMH2eh+CkXmU96uopajGg=="
Content-Type: application/javascript
Vary: Accept-Encoding
Content-Encoding: gzip
Connection: keep-alive
Transfer-Encoding: chunked

【问题讨论】：

你找到解决办法了吗？
不...目前没有解决方案
我也有类似的问题

标签： google-chrome firefox express

【解决方案1】：

gzipped 资源（如 .js .css 和 Vary: Accept-encoding Header with Chrome）存在问题。

请查看我在此处提供的 Anwser：https://stackoverflow.com/a/40726246/135785

这解决了我的问题：

    <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>

检查您的 Apache 配置中的“Header append Vary Accept-Encoding”

【讨论】：