ExtendableEvent

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

ExtendableEvent 接口扩展了在全局作用域上作为服务工作者生命周期一部分分派的 install 和 activate 事件的生命周期。这确保了在升级数据库模式和删除过时的缓存条目之前，不会分派任何功能性事件（如 FetchEvent）。

如果在 ExtendableEvent 处理程序外部调用 waitUntil()，浏览器应该抛出一个 InvalidStateError；还要注意，多个调用将累积，并且生成的 Promise 将添加到 扩展生命周期 Promise 列表中。

此接口继承自 Event 接口。

Event ExtendableEvent

注意：此接口仅在全局作用域为 ServiceWorkerGlobalScope 时可用。当它是 Window 或其他类型的工作者的作用域时，它不可用。

构造函数

ExtendableEvent()

创建一个新的 ExtendableEvent 对象。

实例属性

不实现任何特定属性，但继承其父级 Event 的属性。

实例方法

继承其父级 Event 的方法。.

ExtendableEvent.waitUntil()

扩展事件的生命周期。它旨在在 install 事件处理程序 中为 installing 工作者调用，并在 activate 事件处理程序 中为 active 工作者调用。

示例

此代码片段来自 服务工作者预取示例（请参阅 预取示例）。代码在 oninstall 中调用 ExtendableEvent.waitUntil()，延迟将 ServiceWorkerRegistration.installing 工作者视为已安装，直到传递的 Promise 成功解析。当所有资源都已获取并缓存，或发生任何异常时，Promise 将解析。

此代码片段还展示了服务工作者使用的缓存版本控制的最佳实践。虽然此示例中只有一个缓存，但相同的方法可用于多个缓存。它将缓存的简写标识符映射到特定版本的缓存名称。

注意：在 Chrome 中，可以通过 chrome://serviceworker-internals 访问的相关服务工作者的“检查”界面查看日志语句。

js
const CACHE_VERSION = 1;
const CURRENT_CACHES = {
  prefetch: `prefetch-cache-v${CACHE_VERSION}`,
};

self.addEventListener("install", (event) => {
  const urlsToPrefetch = [
    "./static/pre_fetched.txt",
    "./static/pre_fetched.html",
    "https://www.chromium.org/_/rsrc/1302286216006/config/customLogo.gif",
  ];

  console.log(
    "Handling install event. Resources to pre-fetch:",
    urlsToPrefetch,
  );

  event.waitUntil(
    caches
      .open(CURRENT_CACHES["prefetch"])
      .then((cache) => {
        return cache
          .addAll(
            urlsToPrefetch.map((urlToPrefetch) => {
              return new Request(urlToPrefetch, { mode: "no-cors" });
            }),
          )
          .then(() => {
            console.log("All resources have been fetched and cached.");
          });
      })
      .catch((error) => {
        console.error("Pre-fetching failed:", error);
      }),
  );
});

注意：在获取资源时，如果资源有可能从不支持 CORS 的服务器提供，则使用 {mode: 'no-cors'} 非常重要。在此示例中，www.chromium.org 不支持 CORS。

规范

规范
Service Workers
# extendableevent-interface

浏览器兼容性

BCD 表仅在启用 JavaScript 的浏览器中加载。

另请参阅