InstallEvent
Limited availability
This feature is not Baseline because it does not work in some of the most widely-used browsers.
Tham số được truyền vào hàm xử lý sự kiện install, giao diện InstallEvent đại diện cho hành động cài đặt được gửi đến ServiceWorkerGlobalScope của một ServiceWorker. Là con của ExtendableEvent, nó đảm bảo rằng các sự kiện chức năng như FetchEvent không được gửi trong quá trình cài đặt.
Giao diện này kế thừa từ giao diện ExtendableEvent.
Hàm khởi tạo
InstallEvent()Experimental-
Tạo một đối tượng
InstallEventmới.
Thuộc tính phiên bản
Kế thừa các thuộc tính từ thực thể cha, ExtendableEvent.
Phương thức phiên bản
Kế thừa các phương thức từ thực thể cha, ExtendableEvent.
addRoutes()Experimental-
Chỉ định một hoặc nhiều tuyến tĩnh, định nghĩa các quy tắc tải tài nguyên được chỉ định và sẽ được sử dụng ngay cả trước khi service worker khởi động.
Ví dụ
Đoạn code này lấy từ service worker prefetch sample (xem prefetch running live.) Code gọi ExtendableEvent.waitUntil() trong ServiceWorkerGlobalScope.oninstall và trì hoãn xem xét worker ServiceWorkerRegistration.installing đã được cài đặt cho đến khi promise được truyền vào giải quyết thành công. Promise giải quyết khi tất cả tài nguyên đã được tải và lưu vào cache, hoặc khi có bất kỳ ngoại lệ nào xảy ra.
Đoạn code cũng minh họa phương pháp tốt nhất để tạo phiên bản cache được service worker sử dụng. Mặc dù ví dụ này chỉ có một cache, bạn có thể dùng cách tiếp cận này cho nhiều cache. Code ánh xạ một mã định danh viết tắt cho cache đến một tên cache cụ thể, có phiên bản.
Note: Các câu lệnh logging có thể xem được trong Google Chrome qua giao diện "Inspect" cho service worker liên quan được truy cập qua chrome://serviceworker-internals.
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);
}),
);
});
Thông số kỹ thuật
| Specification |
|---|
| Service Workers Nightly # installevent |