Background Fetch 浏览器支持

Background Fetch 将长时间运行的下载（或上传）任务交给浏览器本身处理：浏览器以 用户可见的方式执行抓取，展示进度并提供取消控件，并在操作完成后唤醒 Service Worker。

浏览器与生态支持

• 图例
• 支持
• 部分支持
• 需开启标志
• 不支持
• 未知

浏览器 / 平台	支持	版本	置信度	来源	备注
Chrome (Desktop)	支持	74	高	来源	—
Chrome (Android)	支持	74	高	来源	1
Edge (Desktop)	支持	79	高	来源	2
Firefox (Desktop)	不支持	—	高	来源	3
Firefox (Android)	不支持	—	高	来源	45
Safari (macOS)	不支持	—	高	来源	6
Safari (iOS)	不支持	—	高	来源	78
Samsung Internet	支持	11.0	高	来源	9
WebView (Android)	不支持	—	高	来源	10

1. 由 browser-compat-data 镜像自 Chrome 的数据推导。
2. 由 browser-compat-data 镜像自 Chrome 的数据推导。
3. browser-compat-data 未记录 Firefox 的支持。
4. browser-compat-data 未记录 Firefox for Android 的支持。
5. 由 browser-compat-data 镜像自 Firefox 的数据推导。
6. browser-compat-data 未记录 Safari 的支持。
7. browser-compat-data 未记录 iOS 版 Safari 的支持。
8. 由 browser-compat-data 镜像自 Safari 的数据推导。
9. 由 browser-compat-data 镜像自 Chrome Android 的数据推导。
10. browser-compat-data 未记录 WebView Android 的支持。

源数据: /compatibility/background-fetch.json · 全球使用占比: 72 % (StatCounter 2026-05)

来源: 规范 · MDN · 最近核验 2026-10-03 · 置信度: 高 (由来源计算)

如何使用

先进行特性检测，然后在 Service Worker 注册对象的 backgroundFetch 管理器上调用 fetch()：

async function startBackgroundFetch(urls) {
  const registration = await navigator.serviceWorker.ready;
  return registration.backgroundFetch.fetch('my-fetch', urls, {
    title: 'Episode 5',
    downloadTotal: 60 * 1024 * 1024,
  });
}

在 Service Worker 中处理结算事件：

self.addEventListener('backgroundfetchsuccess', (event) => {
  event.waitUntil(handleCompletedFetch(event.registration));
});
self.addEventListener('backgroundfetchfail', (event) => {
  event.waitUntil(cleanUpFailedFetch(event.registration));
});

如何在运行时检测

在调用 fetch() 之前先检测 BackgroundFetchManager 是否存在。如果不存在，则改用 普通的 fetch() 逐个下载文件：

async function downloadFiles(urls) {
  if (!('BackgroundFetchManager' in self)) {
    for (const url of urls) {
      const response = await fetch(url);
      await handleResponse(response);
    }
    return;
  }
  const registration = await navigator.serviceWorker.ready;
  await registration.backgroundFetch.fetch('my-fetch', urls, {
    title: 'Files',
    downloadTotal: 0,
  });
}

实践清单

• Firefox 与 Safari 均未实现此 API——根据上表，该能力仅限 Chromium，因此请始终回退 到普通 fetch()，不要假设它可用。
• 将属于同一批次的文件（例如媒体文件及其封面图）合并到一次 fetch() 调用中，使其 作为单个用户可见的下载任务出现。
• 在 Service Worker 中处理 backgroundfetchsuccess 与 backgroundfetchfail 以处理或 清理下载结果；处理 backgroundfetchclick 以便将用户带回相关界面。
• 将 Background Fetch 保留给大型、长时间运行的下载任务——它不能替代那些不需要 用户可见进度的短任务。

下一步

• Periodic Background Sync
• WebTransport

← 返回兼容性浏览器。