Service Worker 是什么

问题

Service Worker 是什么？它有什么作用？

解答

Service Worker 是一个注册在指定源和路径下的事件驱动 Worker，是 Web Worker 的升级版本。它是 PWA（渐进式 Web 应用）的重要组成部分，W3C 组织在 2014 年 5 月提出了这个 HTML5 API。

Service Worker 采用 JavaScript 控制关联的页面或网站，可以拦截并修改访问和资源请求，实现细粒度的资源缓存。通过 Service Worker，你可以完全控制应用在特定情形下的表现，最常见的应用场景是在网络不可用时提供离线访问能力。

主要功能

Service Worker 运行在浏览器后台，独立于网页，可以：

• 拦截网络请求并自定义响应
• 缓存资源，实现离线访问
• 推送通知
• 后台数据同步

基本使用

// 注册 Service Worker
if ('serviceWorker' in navigator) {
  navigator.serviceWorker.register('/sw.js')
    .then(registration => {
      console.log('Service Worker 注册成功:', registration);
    })
    .catch(error => {
      console.log('Service Worker 注册失败:', error);
    });
}

关键点

• Service Worker 是事件驱动的 Worker，运行在浏览器后台，独立于网页
• 主要用于实现离线缓存和资源拦截，是 PWA 的核心技术
• 可以拦截和修改网络请求，实现细粒度的缓存控制
• 需要在 HTTPS 环境下运行（localhost 除外）