service worker 无法用 try...catch 直接捕获 fetch、install、activate 等异步生命周期异常,需通过全局 error/unhandledrejection 监听、主动 catch promise 链、postmessage 回传日志至页面输出,并可结合 workbox 增强可观测性。

Service Worker 本身无法直接使用 try...catch 捕获异步生命周期事件(如 fetch、install、activate)中抛出的未处理异常,也不能访问 window 或 console。错误捕获和日志记录需依赖特定机制:全局 error 和 unhandledrejection 监听、主动 catch Promise 链、以及通过 postMessage 将日志回传给页面进行真实输出。
监听全局错误事件
在 Service Worker 脚本顶部注册 error 和 unhandledrejection 事件监听器,这是捕获意外异常的第一道防线:
-
self.addEventListener('error', event => { ... })可捕获同步语法错误、事件处理器内未捕获的异常 -
self.addEventListener('unhandledrejection', event => { ... })捕获 Promise 链中未catch的拒绝(如fetch()失败且没写.catch()) - 注意:这些事件中的
event.error可能为null,推荐用event.reason(对 rejection)或event.message + event.filename + event.lineno组合定位问题
主动 catch fetch 和生命周期事件中的 Promise
所有异步操作必须显式处理错误,不能依赖顶层监听器兜底:
在 Java 中初始化和管理阿里云 SDK客户端。包括单例模式、线程安全、endpoint 与 region 配置、VPC 终端节点、同步与异步等。
- 在
fetch事件中,对fetch(request)调用加.catch(),否则网络失败会触发unhandledrejection -
install和activate中的waitUntil()必须传入已catch过的 Promise,否则异常会导致安装/激活失败 - 示例:
event.waitUntil(caches.open('v1').catch(err => logToPage('Cache open failed:', err)))
将日志发送到主页面输出
Service Worker 没有 console,但可通过 clients.matchAll() 找到页面客户端,用 postMessage 把错误信息传过去:
- 在 SW 中定义
logToPage(level, msg, data)函数,调用clients.matchAll({ type: 'window' }).then(clients => clients[0]?.postMessage(...)) - 在页面 JS 中监听
navigator.serviceWorker.addEventListener('message', e => console[level](e.data)) - 建议结构化发送:包含时间戳、SW 版本、事件类型(fetch/install)、URL、错误堆栈(
err.stack),方便排查
配合 Workbox 增强可观测性
若项目使用 Workbox,可利用其内置日志和调试能力:
- 开发时启用
workbox.setConfig({ debug: true }),自动输出详细请求/缓存行为 - 监听 Workbox 自定义事件,如
message事件中e.data.type === 'CACHE_NOT_UPDATED'等业务级提示 - 通过
workbox.core.skipWaiting()和workbox.core.clientsClaim()的返回 Promise 添加.catch(),捕获激活阶段异常
Java免费学习笔记:立即使用
解锁 Java 大师之旅:从入门到精通的终极指南










