[nginx] 为何我的网页默认都有缓存导致不能更新??

我在nginx配置里明明就没有设置缓存(除了 /lib 里设置了 Cache-Control),为什么还是大多数代码/文件都被缓存(disk cached)?

导致我每次修复一些bug后客户刷新网页也不能更新,我也是必须在Chrome Developer Tools里开启Dsiable Cache才可以刷新后更新
这里面的 Responses Headers 也没有哪个告诉浏览器要缓存吧? (E-tag 至少会请求下服务器查看有没有更新)

这个常规做法应该是在url后面加get参数v=时间戳,js文件加上,当然服务器会忽略掉这些多余的参数。

然后因为每次请求都是不同的url地址,浏览器就不会缓存了。我也感觉这个办法不是很好,但是弄不明白各种不同的客户端(如wx浏览器)缓存规则是什么样的,只好这么做

这个办法我也考虑过,觉得是个”后补“

例如每个请求后面都加一个 ?v=1.2.34

参数v(version)是由服务器提供的而不是时间戳,在每次我提交代码(git)的时候,后台自动更新这个v,就自动更新代码,更灵活的一点就是每个文件都有自己的v(就像 git 里面每个文件的最近stash都可能不一样)

现在就是很好奇问题的来源(好奇害死猫)

没有看你的 Nginx 配置,以后最好直接贴代码,图片不方便阅读和检索。

HTTP 协议默认就偏好缓存的。就算你不主动设置缓存,也可能会缓存的。这不是一个问题,而是一个feature。

HTTP is designed to cache as much as possible, so even if no Cache-Control is given, responses will get stored and reused if certain conditions are met. This is called heuristic caching .

HTTP caching - HTTP | MDN

建议通读上面 MDN 的文章,我以前读过,但是现在具体的规则忘了不少。你可以主动设置相关的 HTTP Header 来避免缓存,但是缓存静态文件,如图片、CSS、JS 通常是一个好主意。主流的方式是给不同版本的静态文件设置不同的文件名,手动加 query string 也行,用 JavaScript Bundlers,如 Vite,也都有这个功能。

1 个赞

楼上说的对,主流的前端打包工具都提供了将静态文件的文件名改成 hash 的功能。

原来如此,这是默认配置,加上 Cache-Control: no-cache 就OK了!

My idea:
每个文件都有个版本(通过 git 计算),每次加载后直接就保存在localStorage (重点)

每次打开网页的前端判断根据localStorage 判断是否需要请求加载,一般情况下,老用户只需要请求一个 index.htm就够了,其它访问过的页面都直接从localStorage加载,请求/Etag 也不用了

上 PWA / Web Worker,在 worker 里拦截所有的请求,然后根据需要从缓存里读取

1 个赞