{{domxref("FetchEvent")}} インターフェイスの preloadResponse 読み取り専用プロパティは、ナビゲーションプリロードがトリガーされた場合はナビゲーションプリロード {{domxref("Response")}} に解決され、それ以外の場合は undefined に解決される {{jsxref("Promise")}} を返します。
var expectedResponse = fetchEvent.preloadResponse;
{{domxref("Response")}} に解決されるか、それ以外の場合は undefined に解決される {{jsxref("Promise")}}。
このコードスニペットは、ナビゲーションプリロードのページ（英語）からのものです。 {{domxref("ServiceWorkerGlobalScope.onfetch")}} イベントハンドラーは、fetch イベントをリッスンします。 起動したら、{{domxref("FetchEvent.respondWith", "FetchEvent.respondWith()")}} に、制御されたページに戻す Promise を渡します。 この Promise は、{{domxref("Cache")}} オブジェクトで最初に一致した URL リクエストに解決されます。 一致が見つからない場合、コードはプリロード済みのレスポンスをチェックします。 それ以外の場合は、ネットワークからレスポンスをフェッチします。
addEventListener('fetch', event => {
event.respondWith(async function() {
// 可能な場合はキャッシュから応答します
const cachedResponse = await caches.match(event.request);
if (cachedResponse) return cachedResponse;
// それ以外の場合は、プリロード済みのレスポンスがあればそれを使用します
const response = await event.preloadResponse;
if (response) return response;
// それ以外の場合は、ネットワークを試します。
return fetch(event.request);
}());
});
| 仕様 | 状態 | コメント |
|---|---|---|
| {{SpecName('Service Workers', '#fetch-event-preloadresponse', 'preloadResponse')}} | {{Spec2('Service Workers')}} | 初期定義 |
{{Compat("api.FetchEvent.preloadResponse")}}