service worker 是 html 离线运行的唯一可靠基础，必须在 https 或 localhost 下注册激活、拦截 fetch 事件并用 cache api 显式缓存资源；manifest.json 已被淘汰，file:// 协议不支持 service worker。
HTML 离线运行不依赖浏览器默认缓存机制，反而要绕过它——因为标准 HTTP 缓存（Cache-Control、Expires）在断网时不可靠，且无法精确控制资源是否“真正可用”。
Service Worker 是离线能力的唯一可靠基础
没有 Service Worker，所谓“HTML 离线”只是碰运气：页面可能从内存或磁盘缓存中加载，但 JS/CSS/图片大概率 404。它必须注册、激活、监听 fetch 事件，并主动拦截和响应请求。
-
navigator.serviceWorker.register()必须在 HTTPS 或localhost下执行，HTTP 域名直接失败 - 注册脚本（如
sw.js）不能被其他缓存策略干扰——建议响应头加Cache-Control: no-cache - 首次访问不会触发离线逻辑，因为
Service Worker还没激活；第二次刷新才生效
Cache API 与 HTTP 缓存必须分开管理
cache.put() 存的是你手动塞进 Cache 对象的资源，和浏览器地址栏按 F5 触发的 HTTP 缓存完全无关。混淆这两者是离线失败最常见原因。
- 不要指望
Cache-Control: immutable让资源“自动离线可用”——它只影响 HTTP 缓存，不影响Cache对象 -
caches.open('my-offline-cache')创建的缓存需显式match()或keys()操作，不会自动 fallback - HTML 文件本身也要被
cache.put()存入，否则断网后fetch(event.request)仍会走网络并失败
manifest.json 已淘汰，别再用它
manifest.json（配合 html manifest="xxx"）是旧版 AppCache 方案，2021 年起所有主流浏览器已移除支持。Chrome 95+、Firefox 84+、Safari 16.4+ 均不再解析该属性，且控制台会报错 Application Cache is deprecated。
- 若代码里还留着
，请立刻删除——它不仅无效，还会导致 Safari 拒绝注册Service Worker - Webpack/Vite 插件生成的
manifest.json（用于资源指纹映射）与此无关，可保留，但别把它当离线清单用
真正卡住多数人的不是写法，而是调试阶段误以为“本地双击打开 HTML 就算离线”——file:// 协议下 Service Worker 根本无法注册，必须走 http://localhost 或真实域名。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
