ServiceWorkerGlobalScope: install イベント

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2018.

安全なコンテキスト用: この機能は一部またはすべての対応しているブラウザーにおいて、安全なコンテキスト (HTTPS) でのみ利用できます。

メモ: この機能はサービスワーカー内でのみ利用可能です。

install は ServiceWorkerGlobalScope インターフェイスのイベントで、 ServiceWorkerRegistration が新しい ServiceWorkerRegistration.installing ワーカーを取得したときに発行されます。

このイベントはキャンセル不可で、バブリングしません。

構文

このイベント名を addEventListener() 等のメソッドで使用するか、イベントハンドラープロパティを設定するかしてください。

js
addEventListener("install", (event) => {});

oninstall = (event) => {};

イベント型

ExtendableEvent です。 Event を継承しています。

Event ExtendableEvent

イベントプロパティ

固有のプロパティは実装していませんが、親である Event からプロパティを継承しています。

例

以下のスニペットでは、installイベントハンドラーを使用して、キャッシュに多くのレスポンスを投入し、サービスワーカーがオフラインで資産を提供するために使用する方法を示しています。

js
self.addEventListener("install", (event) => {
  event.waitUntil(
    caches
      .open("v1")
      .then((cache) =>
        cache.addAll([
          "/",
          "/index.html",
          "/style.css",
          "/app.js",
          "/image-list.js",
          "/star-wars-logo.jpg",
          "/gallery/",
          "/gallery/bountyHunters.jpg",
          "/gallery/myLittleVader.jpg",
          "/gallery/snowTroopers.jpg",
        ]),
      ),
  );
});

また、 oninstall プロパティを使用して、イベントハンドラーを設定することもできます。

js
self.oninstall = (event) => {
  // ...
};

仕様書

Specification
Service Workers
# dom-serviceworkerglobalscope-oninstall

ブラウザーの互換性

BCD tables only load in the browser

関連情報