BackgroundFetchManager:fetch() 方法

可用性有限

此特性不是基线特性,因为它在一些最广泛使用的浏览器中不起作用。

实验性: 这是一项实验性技术
在生产中使用此技术之前,请仔细检查浏览器兼容性表格

注意:此功能在 Web Workers 中可用。

BackgroundFetchManager 接口的 fetch() 方法在给定一个或多个 URL 或 Request 对象的情况下,会启动一个后台获取操作。

语法

js
fetch(id, requests)
fetch(id, requests, options)

参数

id

一个开发者定义的标识符,可以传递给其他方法以检索此操作的 BackgroundFetchRegistration

requests

一个 RequestInfo 对象或一个 RequestInfo 对象数组。

每个 RequestInfo 对象都是一个 Request 对象或一个字符串,它将作为 input 参数传递给 Request() 构造函数。

options 可选

一个用于自定义浏览器向用户显示的获取进度对话框的对象。它具有以下属性:

title 可选

一个将用作进度对话框标题的字符串。

icons 可选

一个对象数组,每个对象代表浏览器可能用于进度对话框的图标。每个对象都具有以下属性:

src

一个代表图标文件 URL 的字符串。

sizes 可选

一个表示图像尺寸的字符串,使用与 <link> 元素 sizes 属性相同的语法。

type 可选

一个代表图标 MIME 类型的字符串。

label 可选

一个代表图标可访问名称的字符串。

downloadTotal 可选

一个表示获取操作估计总下载大小(以字节为单位)的数字。这用于向用户显示下载的大小以及下载进度。

一旦总下载大小超过 downloadTotal,获取就会被中止。

返回值

一个 Promise,它将解析为一个 BackgroundFetchRegistration 对象。

异常

TypeError

如果在没有提供请求、请求的模式是 no-cors、没有存在 service worker、已存在具有请求的 id 的请求,或请求失败时抛出。

AbortError DOMException

指示获取已被中止。

NotAllowedError DOMException

指示用户尚未获得进行后台获取的权限。

QuotaExceededError

如果因超出浏览器 存储配额 而导致存储请求失败时抛出。

示例

以下示例展示了如何使用 fetch() 来启动后台获取操作。在使用活动的 service worker 时,使用 ServiceWorkerRegistration.backgroundFetch 属性来访问 BackgroundFetchManager 对象并调用其 fetch() 方法。

js
navigator.serviceWorker.ready.then(async (swReg) => {
  const bgFetch = await swReg.backgroundFetch.fetch(
    "my-fetch",
    ["/ep-5.mp3", "ep-5-artwork.jpg"],
    {
      title: "Episode 5: Interesting things.",
      icons: [
        {
          sizes: "300x300",
          src: "/ep-5-icon.png",
          type: "image/png",
          label: "Downloading a show",
        },
      ],
      downloadTotal: 60 * 1024 * 1024,
    },
  );
});

规范

规范
Background Fetch
# background-fetch-manager-fetch

浏览器兼容性