InstallEvent
Baseline 广泛可用 *
作为传递给 install 事件处理函数参数的 InstallEvent 接口，它代表了一个在 ServiceWorker 的 ServiceWorkerGlobalScope 上分派的安装操作。作为 ExtendableEvent 的子类，它确保在安装期间不会分派诸如 FetchEvent 等功能性事件。
此接口继承自 ExtendableEvent 接口。
构造函数
InstallEvent()实验性-
创建一个新的
InstallEvent对象。
实例属性
继承自其父级 ExtendableEvent 的属性.
实例方法
继承自其父级 ExtendableEvent 的方法.
addRoutes()实验性-
指定一个或多个静态路由，这些路由定义了用于获取指定资源的规则，即使在 Service Worker 启动之前也会使用这些规则。
示例
此代码片段来自 Service Worker 预取示例 (请参阅 预取实时运行)。该代码在 ServiceWorkerGlobalScope.oninstall 中调用了 ExtendableEvent.waitUntil()，并推迟将 ServiceWorkerRegistration.installing worker 视为已安装，直到传入的 Promise 成功解析。当所有资源都已获取并缓存，或者发生任何异常时，Promise 就会解析。
代码片段还展示了 Service Worker 使用的缓存版本控制的最佳实践。尽管此示例只有一个缓存，但您也可以将此方法用于多个缓存。该代码将缓存的简写标识符映射到特定的、已版本的缓存名称。
注意: 日志语句可以通过 Google Chrome 的“检查”界面在相关 Service Worker 中可见，该界面可通过 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) =>
cache.addAll(
urlsToPrefetch.map(
(urlToPrefetch) => new Request(urlToPrefetch, { mode: "no-cors" }),
),
),
)
.then(() => {
console.log("All resources have been fetched and cached.");
})
.catch((error) => {
console.error("Pre-fetching failed:", error);
}),
);
});
规范
| 规范 |
|---|
| Service Workers # installevent |
浏览器兼容性
加载中…