js,html 缓存问题

前端代码,自动构建发布,生产环境一直有问题,一直怀疑打包问题,最后发现是缓存问题。
pnpm install → 下载 hanzi-writer-data 到 node_modules/
pnpm run build → 自动先跑 prebuild
prebuild → 把 node_modules/hanzi-writer-data/*.json 复制到 public/hanzi-data/
next build → 打包,public/hanzi-data/ 作为静态资源
SCP 部署 → public/hanzi-data/ 随 public/ 一起上传到服务器
浏览器请求 → /hanzi-data/山.json(同域,无需 CDN)
SW 缓存 → 第一次加载后离线也能用

整个修复链路:

  1. CI 触发 → pnpm install 安装 hanzi-writer-data
  2. prebuild 脚本:复制 9575 个字的 JSON 到 public/hanzi-data/,并把 sw.js 的 CACHE 改为 mindzi-(本次是 mindzi-dd82e3b)
  3. next build 打包,JS 里的 API URL 是 hz.xinqingshehui.cn
  4. 部署前 SSH 清空服务器旧 .next/
  5. SCP 上传,pm2 重启

用户端的更新机制(之后每次发版都自动走这个流程):

  • 用户打开页面 → 老 SW 继续跑(但浏览器后台检测到 sw.js 变了)
  • 新 SW 安装 → skipWaiting() 立即接管 → activate 删掉旧缓存
  • 用户刷新一次→ 完全加载新版本,无需加 URL 参数
posted @ 2026-03-29 17:59  yongliu  阅读(3)  评论(0)    收藏  举报