Cache.match()

Cache インターフェイスの match() メソッドは、Cache オブジェクトで最初に一致したリクエストに関連付けられた Response に解決される Promise を返します。 一致が見つからない場合、Promise は undefined に解決されます。

cache.match(request, {options}).then(function(response) {
  // レスポンスで何かをします
});

request

Cache 内でレスポンスを見つけようとしている Request。 これは、Request オブジェクトまたは URL です。

options Optional

match 操作のオプションを設定するオブジェクト。 使用可能なオプションは次のとおりです。

• ignoreSearch: URL のクエリ文字列を無視するかどうかを指定する Boolean。 例えば、true に設定すると、http://foo.com/?value=bar の ?value=bar の部分は、照合の実行時に無視されます。 デフォルトは false です。
• ignoreMethod: true に設定すると、照合操作が Request HTTP メソッドを検証しないようにする Boolean（通常、GET および HEAD のみが許可されます）。 デフォルトは false です。
• ignoreVary: true に設定すると、VARY ヘッダーの照合を実行しないように照合操作に指示する Boolean。 つまり、URL が一致する場合、Response オブジェクトに VARY ヘッダーがあるかどうかに関係なく一致します。 デフォルトは false です。

リクエストに一致する最初の Response に解決する、または一致が見つからない場合は undefined に解決する Promise。

この例は、カスタムオフラインページの例（ライブデモ）からの引用です。 リクエストが失敗した場合、キャッシュを使用して選択したデータを提供します。 catch() 句は、fetch() の呼び出しが例外をスローしたときにトリガーされます。 catch() 句の内部では、 match() を使用して正しいレスポンスを返します。

この例では、GET HTTP 動詞で取得された HTML 文書のみがキャッシュされます。 if() 条件が false の場合、このフェッチハンドラーはリクエストをインターセプトしません。 他のフェッチハンドラーが登録されている場合、それらは event.respondWith() を呼び出す機会を得ます。 フェッチハンドラーが event.respondWith() を呼び出さない場合、リクエストはブラウザーによって処理され、サービスワーカーが関与していないかのように処理されます。 fetch() が 4xx または 5xx の範囲のレスポンスコードで有効な HTTP レスポンスを返す場合、catch() は呼び出されません。

self.addEventListener('fetch', function(event) {
  // これが HTML 文書に対する GET リクエストである場合のみ、event.respondWith() を呼び出します。
  if (event.request.method === 'GET' &&
      event.request.headers.get('accept').indexOf('text/html') !== -1) {
    console.log('フェッチイベントの処理: ', event.request.url);
    event.respondWith(
      fetch(event.request).catch(function(e) {
        console.error('フェッチ失敗、代わりにオフラインページに戻ります。', e);
        return caches.open(OFFLINE_CACHE).then(function(cache) {
          return cache.match(OFFLINE_URL);
        });
      })
    );
  }
});

• Service worker の使用
• Cache
• WorkerGlobalScope.caches