構文

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

引数

id

この操作の BackgroundFetchRegistration を取得するために、他のメソッドに渡すことができる、開発者定義の識別子です。

requests

RequestInfo オブジェクトまたは RequestInfo お武衛ジェクトの配列です。

それぞれの RequestInfo オブジェクトは Request オブジェクト、または Request() コンストラクターの input 引数として与えられる文字列です。

options 省略可

ブラウザーの表示するフェッチ進捗ダイアログをカスタマイズするために使用されるオブジェクトです。以下のプロパティがあります。

title 省略可

文字列で、進捗ダイアログのタイトルとして使われます。

icons 省略可

ブラウザーの進捗ダイアログに使用するアイコンを表すオブジェクトの配列です。各オブジェクトには、以下のプロパティがあります。

src

アイコンファイルの URL を表す文字列。

sizes 省略可

画像の大きさを表す文字列で、<link> 要素の sizes 属性と同じ構文を使用して表します。

type 省略可

アイコンの MIME タイプを表す文字列です。

label 省略可

アイコンのアクセシブル名を表す文字列です。

downloadTotal 省略可

フェッチ操作の推定総ダウンロードサイズを表す数値（バイト単位）。これは、ダウンロードの大きさをユーザーに示すため、また、ユーザーのダウンロードの進捗状況を示すために使用されます。

ダウンロードサイズの合計が downloadTotal を超えると、すぐに取得が中止されます。

返値

BackgroundFetchRegistration オブジェクトで解決される Promise 。

例外

TypeError

次のような場合に発生します。リクエストが与えられていない場合、リクエストのモードが no-cors の場合、サービスワーカーが存在しない場合、リクエストされた id のリクエストが既に存在する場合、またはリクエストが失敗した場合。

AbortError DOMException

フェッチが失敗したことを示します。

NotAllowedError DOMException

バックグラウンドフェッチを作成するためのユーザー権限が与えられていないことを示します。

QuotaExceededError

格納されているリクエストがブラウザーのストレージ割り当てを越えたために失敗した場合に発生します。

例

下記の例は fetch() を使用してバックグラウンドフェッチ操作を行う方法を方法を示しています。アクティブな サービスワーカーで、 ServiceWorkerRegistration.backgroundFetch プロパティを使用して BackgroundFetchManager オブジェクトにアクセスし、その fetch() メソッドを呼び出しています。

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,
    },
  );
});

仕様書

ブラウザーの互換性