Cache.add()

ジャンプ先:
  1. 構文
  2. 例
  3. 仕様策定状況
  4. ブラウザーの対応
  5. 関連情報

これは実験的な機能です。本番で使用する前にブラウザー実装状況をチェックしてください。

Cache インターフェースの add() メソッドは、URL を受け取り、取得して、指定されたキャッシュに結果のレスポンスオブジェクトを追加します。 add() メソッドは、機能的に次の例と同じです。

fetch(url).then(function(response) {
  if (!response.ok) {
    throw new TypeError('bad response status');
  }
  return cache.put(url, response);
})

より複雑な操作では、 Cache.put() を直接使用する必要があります。

メモ: add() は、リクエストにマッチする、前にキャッシュに保存されたキー/値の組を上書きます。

構文

cache.add(request).then(function() {
  // リクエストはすでに cahce に追加されている。
});

引数

request
キャッシュに加えるリクエスト。 Request オブジェクトか URL を指定できる。

返値

void で解決する Promise。

例外

例外 発生条件
TypeError

URL スキームが http や https ではありません。

レスポンスステータスが200番台（つまり、成功レスポンス）ではありません。これはリクエストが成功を返さない場合や、リクエストがオリジン間の CORS ではないリクエストの場合も発生します (この場合、ステータスが常に 0 で報告されます)。

例

このコードブロックは、InstallEvent が発火するのを待ってから、アプリにインストールプロセスを処理するために、waitUntil を実行します。この処理は、新しい cache を作成するための CacheStorage.open の呼び出しと、資産を追加するための Cache.add の使用で構成されています。

this.addEventListener('install', function(event) {
  event.waitUntil(
    caches.open('v1').then(function(cache) {
      return cache.add('/sw-test/index.html');
    })
  );
});

仕様策定状況

仕様書 策定状況 コメント
Service Workers
Cache の定義		 草案 初回定義

ブラウザーの対応

機能ChromeEdgeFirefoxInternet ExplorerOperaSafari
基本対応44116392 なし313 なし
機能Android webviewChrome for AndroidEdge mobileFirefox for AndroidOpera AndroidiOS SafariSamsung Internet
基本対応441441 なし39313 なし4.0

1. Requires HTTPS from version 46.

2. Service workers (and Push) have been disabled in the Firefox 45 & 52 Extended Support Releases (ESR).

3. Requires HTTPS from version 33.

関連情報

ドキュメントのタグと貢献者

タグ: 
このページの貢献者: mfuji09, YuichiNukiyama
最終更新者: mfuji09,