pwa 缓存管理需“命名隔离+主动清理+版本绑定”:缓存名须含明确版本标识(如 static-v2),install 阶段仅填充新缓存,activate 阶段集中清理旧缓存,fetch 阶段显式指定 cachename 匹配。

在 PWA 中用 caches(即 CacheStorage)管理缓存版本,核心是“命名隔离 + 主动清理 + 版本绑定”。不是靠浏览器自动更新,而是靠你控制缓存名、安装逻辑和激活时机,确保新旧缓存不混用、旧缓存不残留。
缓存名必须带明确版本标识
每次变更资源或策略,就换一个缓存名,比如 'pwa-static-v2'、'api-cache-202608'。不能复用无版本号的名称(如 'cache'),否则无法区分新旧缓存,容易导致离线加载错乱或 stale 内容。
- 推荐格式:
类型-版本号(如static-v3、dynamic-2026.08)或应用名-功能-时间戳 - 所有
caches.open()、caches.match()、caches.delete()都要基于这个带版本的名称操作 - 避免在 install 事件中用动态拼接(如
`cache-${Date.now()}`),会导致每次注册都生成新缓存,旧缓存永远不被清理
install 阶段只打开并填充新缓存
Service Worker 安装时,只负责把当前版本所需的资源写入对应版本的缓存,不读、不删、不碰其他缓存。
在 Java 中初始化和管理阿里云 SDK客户端。包括单例模式、线程安全、endpoint 与 region 配置、VPC 终端节点、同步与异步等。
- 用
e.waitUntil(caches.open('static-v2').then(cache => cache.addAll([...]))); -
cache.addAll()列表必须精简可靠——路径全为同源绝对或根相对路径(如'/index.html'),失败会中断安装 - 不要在 install 里调用
caches.keys()或清理动作,它不属于安装职责
activate 阶段集中清理过期缓存
新 Service Worker 激活时,才是清理旧缓存的唯一安全时机。此时旧 SW 已停止拦截请求,不会影响正在运行的页面。
- 监听
activate事件,用caches.keys()获取所有缓存名 - 过滤出不再使用的名称(比如只保留
static-v2,删掉static-v1、static-v0) - 用
Promise.all(cacheNames.map(caches.delete))并行删除,再调用self.skipWaiting()加速激活
fetch 阶段按需匹配对应版本缓存
每次请求进来,caches.match() 必须指定缓存名,不能依赖默认或模糊查找。
- 静态资源(HTML/CSS/JS)匹配当前版本的 static 缓存:
caches.match(req, { cacheName: 'static-v2' }) - API 数据可匹配独立的 dynamic 缓存:
caches.match(req, { cacheName: 'api-cache-202608' }) - 若需降级(如 API 缓存未命中),再 fallback 到另一个缓存或网络,但每个 match 都要显式传
cacheName
Java免费学习笔记:立即使用
解锁 Java 大师之旅:从入门到精通的终极指南










