BackgroundFetchManager.fetch()

Limited availability

This feature is not Baseline because it does not work in some of the most widely-used browsers.

Experimental: これは実験的な機能です。
本番で使用する前にブラウザー互換性一覧表をチェックしてください。

fetch()BackgroundFetchManager インターフェイスのメソッドで、指定された 1 つ以上の URL または Request オブジェクトを取り、バックグラウンドのフェッチ操作を開始します。

構文

js
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

fetch が失敗したことを示します。

NotAllowedError DOMException

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

下記の例は fetch() を使用してバックグラウンドフェッチ操作を行う方法を方法を示しています。アクティブな サービスワーカー で、 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,
    },
  );
});

仕様書

Specification
Background Fetch
# background-fetch-manager-fetch

ブラウザーの互換性

BCD tables only load in the browser