FetchEvent.request
FetchEvent
接口的只读属性 request
返回触发事件处理程序的 Request
。
这个属性是非空的(自从 Firefox 46 版本开始)。如果一个请求不是由其他方式提供的,构造函数的 options
对象必须包含一个请求(request)(参见 FetchEvent()
)。
值
一个 Request
对象。
示例
来自 service worker fetch 示例的代码片段(fetch 示例的在线演示)。onfetch
事件处理程序监听 fetch
事件。当被触发时,将最终会传递给受控页面的 promise 传递给 FetchEvent.respondWith()
。该 promise 会用 Cache
中第一个匹配的 URL 请求来兑现。如果没有匹配,代码将从网络获取响应。
该代码还会处理 fetch()
操作抛出的异常。注意,HTTP 错误响应(例如 404)不会抛出异常。它将返回一个拥有适当错误代码集的正常的响应对象。
js
self.addEventListener("fetch", (event) => {
console.log("Handling fetch event for", event.request.url);
event.respondWith(
caches.match(event.request).then((response) => {
if (response) {
console.log("Found response in cache:", response);
return response;
}
console.log("No response found in cache. About to fetch from network…");
return fetch(event.request)
.then((response) => {
console.log("Response from network is:", response);
return response;
})
.catch((error) => {
console.error("Fetching failed:", error);
throw error;
});
}),
);
});
规范
Specification |
---|
Service Workers # fetch-event-request |
浏览器兼容性
BCD tables only load in the browser