这是一个创建于 1195 天前的主题，其中的信息可能已经有所发展或是发生改变。
最近在项目上调整了前端调用 API 时 header 的内容，发布后发现由于用户本地缓存，导致 header 内容不对，进而请求 API 接口失败。 因为是内部项目，以往都是告诉用户清除一下缓存再使用，但是感觉不太优雅，而且浏览器还会缓存一些用户自定义的 table 样式，无脑的清除缓存也存在一些问题。 请各位大佬赐教！
 | 1 richangfan 2022-07-09 09:37:52 +08:00 接口和 index.html 文件设置 max-age 之类的响应头，其他文件不需要 |
 | 2 dcsuibian 2022-07-09 10:02:09 +08:00 via Android  1 改名字，html 不缓存。 举个例子，如果原来的 js 文件是 a.js ，新的 js 文件是 b.js 。 在 html 里原来的 link 指向 a.js ，现在就变成指向 b.js 。浏览器发现文件名不同就会再发出请求。a.js 的缓存仍然有效，但 a.js 已经不会再使用了。 |
| 3 dcsuibian 2022-07-09 10:06:33 +08:00 via Android 现代点的前端就是这么干的，webpack 就可以。 把需要的静态资源分割成块，每一块计算哈希值。文件变化后对应块的哈希值变了。同时帮你修改生成的 index.html 。 这样没变的块仍然可以走缓存（比如说依赖的类库啥的），变了的块就用新的。 |
| 4 dcsuibian 2022-07-09 10:17:09 +08:00 via Android 还有一种不改文件名的方式，是加入查询参数。 比如 a.js?ppp=xxxxxxxxx |
 | 5 YNaN 2022-07-09 10:22:49 +08:00 脚手架出入口的 hash 命名规则改下 |
 | 6 wanguorui123 2022-07-09 10:37:38 +08:00 用 ETag 然后把 Cache 设置短点 |
 | 7 kekxv 2022-07-09 11:48:11 +08:00 via iPhone 你们自己问题，没事瞎改拦截，还不兼容上一版 |
 | 8 wu67 2022-07-09 12:09:27 +08:00 现在的脚手架工具默认都是 build 的时候给文件加上 hash 了吧. 除非你那个用户就开着页面一直不刷新, 只在当前页面点点点, 这样 index.html 里面的 js 路径貌似不会变... |
 | 9 arch9999 2022-07-09 12:21:00 +08:00 ``` <link rel="stylesheet" href="/static/css/vendor/tomorrow.css?v=3c006808236080a5d98ba4e64b8f323f" type="text/css"> <link rel="icon" sizes="192x192" href="/static/icon-192.png"> <link rel="apple-touch-icon" sizes="180x180" href="/static/apple-touch-icon-180.png?v=91e795b8b5d9e2cbf2d886c3d4b7d63c"> ``` 按 F12 看看本页面。 |
 | 10 wangkun025 2022-07-09 12:28:16 +08:00 Rails 框架用的是改名字吧。 |
 | 11 Pooc 2022-07-09 12:45:29 +08:00 像 Webpack 、Vite 之类的打包，生成的 js 之类的静态文件默认会改哈希值文件名，只需要运维设置下 index.html 不缓存就可以了 |
 | 12 agagega 2022-07-09 12:46:37 +08:00 Rails 的方案是：假如目标文件叫 vendor.js ，那最终输出的文件就是 vendor-xxxxx.js (一段 hash)，不用 query string 是因为某些地方做缓存的时候说不定也会把 query string 忽略掉 |
 | 13 LeegoYih 2022-07-09 12:52:17 +08:00 请求静态文件加时间戳或签名就行，如：main.min.js?t=123456 |
 | 14 suyanhanx 2022-07-10 22:03:43 +08:00 大公司里怎样开发和部署前端代码？ - 张云龙的回答 - 知乎 https://www.zhihu.com/question/20790576/answer/32602154 |
 | 15 mingdongshensen 2022-07-17 17:06:49 +08:00 ServiceWorker + Notification APIs, 在主线程里根据推送来的消息内容自定义任何你想做的 dom 相关操作，比如这时候可以主动通过推送告诉用户网页更新版本了，让用户点击一个你提供的小按钮，触发网页重载 |
| 16 mingdongshensen 2022-07-17 17:14:06 +08:00 @dcsuibian 我感觉还需要一个推送功能，及时告诉用户，此时此刻你的 html 不是最新版本，你需要手动刷新页面或者你需要同意我帮你自动刷新一下页面 |
Select Language