html缓存更新需服务端响应头、构建哈希、客户端校验协同；单独改html无效，因浏览器忽略meta缓存指令，且html强缓存会导致js哈希无法更新。
能实现，但关键不在 HTML 本身，而在于构建、服务端响应头、客户端校验三者协同。单独在 HTML 里加个 <meta> 或改个 src 路径没用，浏览器根本不认。
为什么不能靠 HTML 自己控制缓存更新
HTML 文件（如 index.html）的缓存行为完全由服务器返回的 HTTP 响应头决定，<meta http-equiv="Cache-Control"> 在现代浏览器中被忽略。如果你把 JS 的哈希写死在 HTML 里，比如 <script src="app.a1b2c3.js"></script>，那这个 HTML 一旦被强缓存（比如 Cache-Control: max-age=31536000），浏览器就再也不会重新请求它——也就永远看不到新的哈希值，新 JS 永远加载不上。
常见错误现象：
- 用户刷新页面，Network 面板里
index.html显示200 (from memory cache)，但 JS 报错或功能缺失 - 手动改了
app.x4y5z6.js的路径，但 HTML 还是加载旧的app.a1b2c3.js，因为 HTML 没更新
必须配合服务端设置 Cache-Control 和 ETag
静态资源（JS/CSS/图片）要长期缓存，前提是它们的 URL 必须带内容哈希，且服务端要配对启用 immutable 和协商缓存。否则浏览器可能在哈希变更后仍复用旧缓存。
推荐 Nginx 配置片段（针对带哈希的静态文件）：
location ~* \.(js|css|png|jpg|gif|webp|woff2)$ {
add_header Cache-Control "public, max-age=31536000, immutable";
etag on;
if_modified_since exact;
}
说明：
如果你了解HTML，CSS和JavaScript，您已经拥有所需的工具开发Android应用程序。本动手本书展示了如何使用这些开源web标准设计和建造，可适应任何Android设备的应用程序 - 无需使用Java。您将学习如何创建一个在您选择的平台的Android友好的网络应用程序，然后转换与自由PhoneGap框架到一个原生的Android应用程序。了解为什么设备无关的移动应用是未来的潮流，并开始构建应用程序，提供更
-
max-age=31536000让浏览器缓存一年，但仅当 URL 不变时才安全 -
immutable告诉 Chrome 等浏览器：只要 URL 没变，就别发条件请求（省掉一次If-None-Match往返） -
etag on+if_modified_since exact是 fallback：万一 URL 没变但内容被误覆盖（极少见），ETag 仍能触发 304 校验 - 注意：HTML 文件必须单独配置，例如
Cache-Control: no-cache, must-revalidate或max-age=0，绝不能设长缓存
前端运行时用 localStorage 存 manifest.json 实现增量感知
光靠服务端头只能保证“URL 变则必拉”，但无法做到“只拉变动的几个文件”。要实现真正按需更新，得让前端知道哪些资源变了——这就需要 manifest.json + localStorage。
实操要点：
- 构建时生成
manifest.json，内容如{"main.js": "a1b2c3d4", "style.css": "e5f6g7h8"}，并部署为可公开访问的静态资源（如/assets/manifest.json） - 页面初始化时 fetch 它，与
localStorage.getItem('assetFingerprints')比对；有差异就标记对应资源需重载 - 动态插入 script/link 前，检查当前 URL 中的哈希是否匹配本地记录；不匹配就强制加时间戳（如
?t=1746847200）或换新 URL - 不要把整个 JS 内容存进
localStorage——5MB 限制+阻塞主线程，只存轻量指纹映射即可 - 必须加兜底：每次发布生成唯一
buildId，存在 HTML 模板或通过 API 返回；若buildId变了，直接清空localStorage中所有指纹，避免跨版本比对错乱
Service Worker 是静默更新的可靠选择，但别绕过 manifest 校验
想让用户无感更新？Service Worker 能拦截请求、预加载、更新 Cache Storage，但它本身不解决“该不该更新”的判断问题——这个逻辑还得靠 manifest.json。
典型流程：
- SW install 阶段 fetch
/assets/manifest.json，解析后调用cache.addAll()预加载关键资源 - fetch 事件中，对每个静态资源请求，先查本地缓存的 manifest，再比对远程 manifest；不一致就 fetch 新资源并
cache.put() - 更新完成后，用
postMessage通知主页面：“有新版本，可刷新” - 切忌在 SW 里硬编码资源列表或跳过 manifest 校验——这会让构建和运行时脱节，上线后发现资源漏更新
容易被忽略的一点：manifest 请求失败（如离线、CDN 故障）时，SW 不能卡住页面。必须 fallback 到已缓存的 manifest（如有），或直接放行请求走网络，同时记录错误日志供后续分析。否则一个 JSON 404 就导致整个应用白屏。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
