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 |
瀏覽器相容性
載入中…