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

参见