JavaScript不直接控制强缓存，需通过内容哈希文件名实现静态资源长期缓存、HTML禁用强缓存，并配合服务端Cache-Control策略与Service Worker精准管理。
JavaScript 本身不直接控制浏览器强缓存，但可以通过构建策略、资源引用方式和服务端配合，让强缓存既高效又不失更新能力。关键不是“绕过”强缓存，而是让它“聪明地缓存”——静态资源长期缓存，HTML 文件不缓存或短缓存，靠文件名或查询参数触发新版本加载。
给静态资源加内容哈希（推荐首选）
构建工具（如 Webpack、Vite、Rollup）在打包时自动为 JS/CSS/图片等生成带哈希值的文件名，例如 app.a1b2c3.js。只要文件内容变化，哈希就变，文件名也变。这样：
- 浏览器认为是全新资源，必然发起请求，不会复用旧缓存
- 服务端可放心设置
Cache-Control: public, immutable, max-age=31536000 - HTML 中引用的是新文件名，自然加载最新版
HTML 文件必须禁用强缓存
HTML 是入口，它决定了加载哪些 JS/CSS。如果 HTML 被强缓存，哪怕 JS 文件已更新，用户仍会加载旧 HTML，从而引用旧资源路径。
服务端应为 .html 响应设置：
立即学习“Java免费学习笔记（深入）”；
JavaStoryDevelop
下载
你接手一个需求时，是不是经常这样："改一个小字段 → 结果把不相关的代码也改了"、"需求说得很模糊 → 做着做着发现跑偏了"、"数据库加个字段 → 上线才发现漏了数据兼容"、"做了个新功能 → 一个月后自己都忘了当时怎么设计的"、"写到一半被中断 → 再回来不知道从哪继续"；这个 Skill 就是专门解决这些问题的。 它会自动探测你的项目环境（JDK、Spring Boot、ORM、数据库、前端框架），记在
-
Cache-Control: no-cache, must-revalidate（触发协商缓存） - 或更严格：
no-store（完全不缓存） - 同时配
Pragma: no-cache和Expires: 0
这样每次访问 HTML 都会向服务器验证，确保拿到最新版本。
避免用 ?v= 时间戳或随机数破坏缓存有效性
手动在 URL 后加 ?v=1.2.3 或 ?t=1723002000 看似简单，但有隐患：
- 若版本号没随内容变化（比如只改了代码但忘了改 v 值），缓存不会更新
- 若每次构建都加随机数，浏览器无法复用任何缓存，失去强缓存意义
- CDN 可能忽略查询参数，导致缓存穿透
真正可靠的方式是哈希文件名，而非依赖查询参数。
配合 Service Worker 实现精准控制（进阶）
当需要离线支持或更细粒度缓存策略时，可用 Service Worker 主动管理缓存：
- 安装阶段预缓存核心资源（含哈希文件名）
- fetch 事件中优先匹配 cache，未命中再请求网络
- 更新 SW 脚本时，自动清除旧 cache 并载入新资源列表
注意：SW 的更新依赖 HTML 文件刷新，所以 HTML 缓存策略仍是前提。
