JavaScript无法直接删除浏览器磁盘缓存，核心是通过内容哈希文件名（如app.a1b2c3d4.js）确保URL唯一性，配合Cache-Control: max-age=31536000, immutable实现强缓存，HTML则设no-cache、must-revalidate并启用ETag验证，必要时用Service Worker主动管理。
JavaScript 本身不能直接删除浏览器磁盘上的缓存文件，清理“失效静态资源”的本质不是擦除旧文件，而是让浏览器主动放弃使用它、转而请求新版本。关键在于**控制请求唯一性**和**协同服务端策略**，而不是调用某个 JS 方法“清空缓存”。
给静态资源加内容哈希文件名
这是最稳定、推荐用于生产环境的做法。构建工具（如 Vite、Webpack）在打包时自动为 JS/CSS 文件生成基于内容的哈希，例如 app.a1b2c3d4.js。只要代码变动，哈希就变，URL 就不同——浏览器视其为全新资源，自然绕过旧缓存。
- 无需改业务逻辑，只需开启构建配置（如 Vite 的
build.rollupOptions.output.entryFileNames） - HTML 中引用的 script/link 标签由构建工具自动更新，确保路径同步
- 比时间戳或版本号更可靠：避免重复请求，同时保留有效缓存价值
配合合理的 HTTP 缓存响应头
前端不发响应头，但必须和部署平台（如 Nginx、Vercel、Netlify）协作设置：
JavaStoryDevelop
下载
你接手一个需求时，是不是经常这样："改一个小字段 → 结果把不相关的代码也改了"、"需求说得很模糊 → 做着做着发现跑偏了"、"数据库加个字段 → 上线才发现漏了数据兼容"、"做了个新功能 → 一个月后自己都忘了当时怎么设计的"、"写到一半被中断 → 再回来不知道从哪继续"；这个 Skill 就是专门解决这些问题的。 它会自动探测你的项目环境（JDK、Spring Boot、ORM、数据库、前端框架），记在
- 对带哈希的 JS/CSS 文件：设 Cache-Control: max-age=31536000, immutable（缓存 1 年且声明不可变）
- 对 HTML 文件：设 Cache-Control: no-cache, must-revalidate，并启用 ETag 或 Last-Modified 协商验证
- 纯静态站点可用
_headers（Netlify）、vercel.json或 Nginx 配置统一管理，无需改代码
用 Service Worker 主动接管缓存
适合需要离线能力或精细控制缓存生命周期的 PWA 应用：
立即学习“Java免费学习笔记（深入）”；
- 新 SW 安装时可调用
caches.delete('cache-v1')清掉旧缓存 - 在
fetch事件中优先匹配缓存，失败再走网络（缓存优先策略） - 新 SW 需调用
self.skipWaiting()和clients.claim()才能立即生效
开发调试阶段快速绕过缓存
不适合线上，但对本地验证很有用：
- Chrome DevTools → Network 标签页 → 勾选 “Disable cache”（仅当前调试会话生效）
- 强制刷新快捷键：Ctrl+Shift+R（Windows/Linux）或 Cmd+Shift+R（macOS）
- 手动修改资源 URL 加查询参数，如
app.js?v=20260813，仅作临时验证，勿用于生产
