FetchEvent:handled 属性

Baseline 已广泛支持

此功能已成熟,并可在多种设备和浏览器版本上运行。自 2022 年 9 月起,所有浏览器都已支持此功能。

注意:此功能仅在 Service Workers 中可用。

FetchEvent 接口的 handled 属性返回一个 Promise,指示该事件是否已被 fetch 算法处理。此属性允许在浏览器消耗响应后执行代码,通常与 waitUntil() 方法一起使用。

一个 Promise,在事件尚未处理时处于 pending 状态,一旦处理完成则 fulfilled。

示例

js
addEventListener("fetch", (event) => {
  event.respondWith(
    (async function () {
      const response = await doCalculateAResponse(event.request);

      event.waitUntil(
        (async function () {
          await doSomeAsyncStuff(); // optional

          // Wait for the event to be consumed by the browser
          await event.handled;

          return doFinalStuff(); // Finalize AFTER the event has been consumed
        })(),
      );

      return response;
    })(),
  );
});

规范

规范
Service Workers
# dom-fetchevent-handled

浏览器兼容性

另见