版本发了三天,客服还在收旧界面的截图,用户强制刷新就正常,第二天再打开又回到旧版。第一次遇到会往复杂处想,其实漏掉的多是个小前提。
location = /index.html {
add_header Cache-Control 'no-cache, must-revalidate';
}
index.html 被配上了很长的 max-age,浏览器直接吃本地副本,连请求都不发,新的 JS 文件名根本没机会拿到。带 hash 的静态资源可以长期缓存,入口 HTML 必须每次回源校验。这一点先确认清楚,后面就不用反复试。
「index.html 强缓存」相关的验证我通常做两遍,改完一次、隔天再看一次,确认不是临时生效。临时改动用注释写上日期和原因,过两周自己都记不清为什么这么写。
动手前把原文件复制一份带时间戳,出问题立刻换回去,比现场分析快得多。一次只改一处,改完立刻验证,几个改动叠在一起,出问题就说不清是谁导致的。
具体做法是,给 index.html 单独加 Cache-Control: no-cache,其余静态资源保留长缓存;CDN 上把 html 后缀的缓存规则改成不缓存,别跟 js、css 共用一条;发布后刷一次入口,确认响应头里没有 max-age。
改完照着核一遍,发布后普通刷新就能看到新版本,响应头里 index.html 是 no-cache。
