![如何配置 nginx 缓存来帮助 Chrome 浏览器](https://linux22.com/image/725453/%E5%A6%82%E4%BD%95%E9%85%8D%E7%BD%AE%20nginx%20%E7%BC%93%E5%AD%98%E6%9D%A5%E5%B8%AE%E5%8A%A9%20Chrome%20%E6%B5%8F%E8%A7%88%E5%99%A8.png)
我遇到一个问题,Chrome 浏览器无法重新加载更新的 javascript。
这是因为,在 Chrome 中,请求从未发送到服务器。
我支持的其他浏览器(Firefox、Edge、Safari)运行良好;这似乎是因为它们发送了 If-Modified-Since 标头。
该文件作为静态资产集合的一部分提供。所有内容均由 nginx 压缩。
站点可用/默认:
root /var/www;
index index.php index.html index.htm;
// some php stuff ...
/etc/nginx.conf 中的相关行(可能?)
# Proxy cache
proxy_cache_path /var/tmp/nginxcache keys_zone=one:10m;
获取 JavaScript 的 Curl 输出:
< HTTP/1.1 200 OK
* Server nginx/1.4.6 (Ubuntu) is not blacklisted
< Server: nginx/1.4.6 (Ubuntu)
< Date: Sun, 05 Aug 2018 11:52:44 GMT
< Content-Type: application/x-javascript
< Content-Length: 2350005
< Last-Modified: Sun, 05 Aug 2018 11:38:36 GMT
< Connection: keep-alive
< Vary: Accept-Encoding
< ETag: "5b66e1bc-23dbb5"
< Accept-Ranges: bytes
nginx 中是否有配置可以说服 Chrome 也这样做?我探索了以下答案:为 nginx 提供的静态内容设置过期标头和https://stackoverflow.com/questions/17251503/set-expires-to-max-for-all-images-of-all-servers-in-nginx/17253805#17253805但我的正则表达式技能相当差,而且答案也相当老旧。我应该尝试:
location ~ \.js {
expires 1d;
add-header Pragma public
add-header Cache-control "public"
}
答案1
感谢@Michael Hampton 的帮助,我将这个位置块添加到服务器:
location ~* \.(:manifest|html?|json)$ {
expires 1d;
}
所以我的index.html在一天后过期。
我还开始使用 gulp 和 gulp-rev 构建应用程序,以获取应用程序名称的版本哈希,例如 app-xyzz56464.js,然后将其放在 index.html 中。