我在nginx配置里明明就没有设置缓存(除了 /lib
里设置了 Cache-Control
),为什么还是大多数代码/文件都被缓存(disk cached
)?
导致我每次修复一些bug后客户刷新网页也不能更新,我也是必须在Chrome Developer Tools
里开启Dsiable Cache
才可以刷新后更新
这里面的 Responses Headers
也没有哪个告诉浏览器要缓存吧?
(E-tag 至少会请求下服务器查看有没有更新)
我在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 .
建议通读上面 MDN 的文章,我以前读过,但是现在具体的规则忘了不少。你可以主动设置相关的 HTTP Header 来避免缓存,但是缓存静态文件,如图片、CSS、JS 通常是一个好主意。主流的方式是给不同版本的静态文件设置不同的文件名,手动加 query string 也行,用 JavaScript Bundlers,如 Vite,也都有这个功能。
楼上说的对,主流的前端打包工具都提供了将静态文件的文件名改成 hash 的功能。
原来如此,这是默认配置,加上 Cache-Control: no-cache
就OK了!
My idea:
每个文件都有个版本(通过 git
计算),每次加载后直接就保存在localStorage
(重点)
每次打开网页的前端判断根据localStorage
判断是否需要请求加载,一般情况下,老用户只需要请求一个 index.htm
就够了,其它访问过的页面都直接从localStorage
加载,请求/Etag 也不用了
上 PWA / Web Worker,在 worker 里拦截所有的请求,然后根据需要从缓存里读取