为何service worker在缓存3个页面后突然无法继续缓存页面

• 首先检查缓存配额是否耗尽：调用navigator.storage.estimate()接口查看当前域名下已使用的缓存空间和总配额，确认是否已经触及存储上限，导致后续缓存写入被浏览器拦截。浏览器对不同域名的缓存存储配额有差异，通常在几十MB到数百MB不等，如果缓存的资源体积较大很容易触及上限。
• 检查缓存实例命名是否冲突：确认所有缓存写入逻辑都使用同一个缓存名称，避免后续资源被写入其他未被追踪的缓存实例，无法在预期的缓存列表中查到。
• 排查fetch事件监听逻辑：
  • 检查路由匹配规则是否仅匹配前3个页面的路径，或存在请求次数、请求类型的限制逻辑，导致后续页面请求没有触发缓存写入流程
  • 检查缓存写入前的响应校验逻辑是否过于严格，比如仅缓存状态码为200的同域响应，后续页面请求的响应不符合规则被直接过滤
• 确认预缓存与动态缓存规则：如果前3个页面是install阶段预缓存的静态资源，检查预缓存列表是否仅配置了这3个路径；后续动态缓存的规则是否没有命中新增页面的路径规则。
• 检查缓存淘汰策略配置：如果配置了LRU等缓存淘汰策略，确认缓存最大条目数是否被设为3，导致新增缓存时会自动淘汰最早的条目，表面上看没有新增缓存记录。

内容的提问来源于stack exchange，提问作者elburg