The preloadResponse
read-only property of the
FetchEvent
interface returns a Promise
that resolves to the
navigation preload Response
if navigation preload was triggered or
undefined otherwise.
Syntax
var expectedResponse = fetchEvent.preloadResponse;
Value
Example
This code snippet is from the navigation
preload page. The ServiceWorkerGlobalScope.onfetch
event handler
listens for the fetch
event. When fired, pass a promise that back to the
controlled page to FetchEvent.respondWith()
.
This promise resolves to the first matching URL request in the Cache
object. If no match is found, the code checks for a preloaded response. Else it fetches
a response from the network.
addEventListener('fetch', event => {
event.respondWith(async function() {
// 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);
}());
});
Specifications
Specification | Status | Comment |
---|---|---|
Service Workers The definition of 'preloadResponse' in that specification. |
Working Draft | Initial definition. |
Browser compatibility
BCD tables only load in the browser