HTML5 Application Cache 已被废弃，但残留缓存仍会干扰开发；需手动清除 chrome://appcache-internals 或 about:cache 中的条目，并在服务器拦截 .appcache 请求以彻底规避。
HTML5 Application Cache 已被废弃，但残留缓存仍会干扰开发
HTML5 的 applicationCache（AppCache）早在 Chrome 78、Firefox 72、Safari 14.1 中被彻底移除，但旧版缓存数据仍可能顽固驻留在浏览器中，导致页面加载陈旧资源、JS 不更新、甚至白屏。这不是“删不掉”，而是浏览器对已废弃机制的清理策略滞后，尤其在 Service Worker 与 AppCache 共存或切换过渡期更明显。
强制清除 AppCache 的可靠方法（Chrome / Edge / Firefox）
不能依赖「清空浏览数据」里的常规选项——AppCache 是独立存储，需手动触发清除。关键路径和操作如下：
- Chrome / Edge：访问
chrome://appcache-internals/（或edge://appcache-internals/），页面列出所有已注册的 manifest URL，逐条点击Remove - Firefox：访问
about:cache→ 滚动到底部点击Application Cache Device→ 查看并删除对应 origin 条目 - 无界面环境（如 CI 测试）：启动浏览器时加参数
--disable-application-cache或使用--user-data-dir隔离全新配置
检查是否仍有 AppCache 干扰的快速验证方式
即使你已改用 Service Worker，旧 AppCache 仍可能劫持请求。执行以下检查可快速定位：
- 打开 DevTools →
Application面板 → 左侧菜单中若还显示Cache Storage下方有Application Cache区域（非灰色不可点），说明仍有残留 - 控制台运行
window.applicationCache：返回对象即表示该页面曾注册过 manifest，即使当前 HTML 已移除manifest属性，浏览器仍可能缓存关联资源 - Network 面板中查看某个 JS 文件响应头：若含
X-Content-Type-Options: nosniff且状态码为200 (from Application Cache)，就是它在作祟
彻底规避 AppCache 的工程实践要点
不再写 manifest 属性只是第一步；历史遗留和第三方脚本可能悄悄注册。真正有效的防护措施包括：
立即学习“前端免费学习笔记（深入）”；
- 在服务器层拦截所有
.appcache请求，返回404或410，防止被重新注册 - 检查所有 HTML 中是否残留
，包括模板、CMS 输出、微前端子应用入口 - 若用 Webpack/Vite，确认构建插件未意外注入
applicationCache相关代码（某些老版本html-webpack-plugin曾有此问题） - Service Worker 注册前，主动调用
window.applicationCache.swapCache()（仅兼容旧浏览器）或window.applicationCache.abort()清理挂起状态（极少数场景需要）
if ('applicationCache' in window) {
window.applicationCache.abort();
// 注意：这不会删除已缓存内容，仅终止当前更新流程
}
最麻烦的不是技术手段，而是团队里还有人以为 manifest 是“现代离线方案”——得先统一认知，再删缓存。
