实现完整离线浏览需配合Service Worker的步骤如下:注册Service Worker在主线程JavaScript中检测浏览器支持调用navigator.serviceWorker.register()注册指定Service Worker脚本路径(通常为/sw.js)安装阶段监听install事件使用caches.open()创建/打开缓存调用cache.addAll()预缓存关键资源跳过
max-age用法: Cache-Control: max-age=seconds解析: 指定资源在缓存中的最大存储时间(秒)。在此期间内,浏览器直接从缓存加载资源,不发送请求到服务器。示例: Cache-Control: max-age=3600(缓存1小时)。immutable用法: Cache-Control: immutable解析: 声明资源在有效期内(如max-age内)不会改变。浏览
文件更新触发条件浏览器检测到Service Worker文件(sw.js)的字节级变化(即使内容不同但字节相同不会触发)。更新流程下载新文件:浏览器在后台下载新Service Worker文件。安装阶段:触发install事件,新旧Worker共存。等待阶段:新Worker处于waiting状态,直到旧Worker控制的页面全部关闭。激活阶段:触发activate事件,新Worker接管控制。强制