NotificationEvent

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

NotificationEvent通知 APIのインターフェイスで、サービスワーカー (ServiceWorker) の ServiceWorkerGlobalScope で配信される通知イベントを表します。

このインターフェイスは ExtendableEvent インターフェイスを継承しています。

メモ: ServiceWorkerGlobalScope オブジェクトで発行される持続的な通知イベントのみが、NotificationEventインターフェイスを実装します。Notification オブジェクトで発行される非持続的な通知イベントは、Eventインターフェイスを実装します。

Event ExtendableEvent NotificationEvent

コンストラクター

NotificationEvent()

新しい NotificationEvent オブジェクトを作成します。

インスタンスプロパティ

親インターフェイスである ExtendableEvent から継承したプロパティもあります。

NotificationEvent.notification 読取専用

イベントを発生させるためにクリックされた通知を表す Notification オブジェクトを返します。

NotificationEvent.action 読取専用

ユーザーがクリックした通知ボタンの文字列 ID を返します。ユーザーがアクションボタン以外の場所で通知をクリックした場合、または通知にボタンがない場合、この値は空の文字列を返します。

インスタンスメソッド

親インターフェイスである ExtendableEvent から継承したメソッドもあります。

js
self.addEventListener("notificationclick", (event) => {
  console.log(`On notification click: ${event.notification.tag}`);
  event.notification.close();

  // これは、現在のページが既に開いているかどうかを確認し、
  // そうならばフォーカスします
  event.waitUntil(
    clients
      .matchAll({
        type: "window",
      })
      .then((clientList) => {
        for (const client of clientList) {
          if (client.url === "/" && "focus" in client) return client.focus();
        }
        if (clients.openWindow) return clients.openWindow("/");
      }),
  );
});

仕様書

Specification
Notifications API Standard
# notificationevent

メモ: このインターフェイスは通知 API で定義されていますが、ServiceWorkerGlobalScope を通してアクセスします。

ブラウザーの互換性

BCD tables only load in the browser