// sw.js
console.log('[sw]', 'cache hit', url);
self.clients.matchAll().then(cs => cs.forEach(c => c.postMessage({log: url})));
sw.js 里的 console.log 一条都不输出,Sources 里找不到这个脚本,改成 debugger 语句也没有停下来,页面本身的日志正常。这类现象通常不是突然出现的,往前翻半天日志能看到苗头。
追下去是这么回事:Service Worker 跑在独立线程,日志输出在它自己的上下文里,默认跟页面控制台分开。脚本没被当成独立目标打开时,断点自然不会命中。
「SW 调试」确认了原因之后,改动尽量只碰那一处,顺手改的东西后面最容易出问题。同类问题如果隔一段时间又出现,多半是某个定时任务或重启流程把改动冲掉了。
把这次用到的命令存进笔记,比记住结论有用,换个环境还能照着走。改完隔一天再看一次,当场正常不代表能稳住。
处理上按这个顺序:在 Application 的 Service Workers 区域点 inspect,打开专用调试窗口;Chrome 里勾选 Show all,更新后点 update 重新注册一次;日志加统一前缀,必要时用 postMessage 转发到页面打印。
确认没问题再收工,专用调试窗口能看到带 [sw] 前缀的日志,断点能在 fetch 回调里停住。
