FetchEvent: preloadResponse 屬性
注意：此功能僅在 Service Workers 中可用。
preloadResponse 是 FetchEvent 介面的一個只讀屬性，它返回一個 Promise。如果觸發了導航預載入，則此 Promise 會解析為導航預載入的 Response；否則，它會解析為 undefined。
如果啟用了導航預載入，請求是 GET 請求，並且該請求是導航請求（由瀏覽器在載入頁面和 iframe 時生成），則會觸發導航預載入。
服務工作執行緒可以在其 fetch 事件處理程式中等待此 Promise，以便跟蹤在服務工作執行緒啟動期間發出的 fetch 請求的完成情況。
值
示例
此程式碼片段來自 使用導航預載入加速服務工作執行緒。
onfetch 事件處理程式監聽 fetch 事件。當事件觸發時，處理程式呼叫 FetchEvent.respondWith()，將一個 Promise 返回給受控制的頁面。此 Promise 將使用請求的資源進行解析。
如果在 Cache 物件中存在匹配的 URL 請求，則程式碼返回從快取中獲取響應的 Promise。如果快取中未找到匹配項，則程式碼返回 preloadResponse 中的 Promise。如果不存在匹配的快取或預載入的響應，則程式碼從網路獲取響應並返回關聯的 Promise。
js
addEventListener("fetch", (event) => {
event.respondWith(
(async () => {
// Respond from the cache if we can
const cachedResponse = await caches.match(event.request);
if (cachedResponse) return cachedResponse;
// Else, use the preloaded response, if it's there
const response = await event.preloadResponse;
if (response) return response;
// Else try the network.
return fetch(event.request);
})(),
);
});
規範
| 規範 |
|---|
| Service Workers # fetch-event-preloadresponse |
瀏覽器相容性
載入中…