Notification

Notification は Notifications API のインターフェイスで、ユーザーへのデスクトップ通知の設定と表示に使われます。これらの通知の表示方法や機能はプラットフォームによって異なりますが、一般にユーザーに対して非同期に情報を提供する方法を提供します。

コンストラクター

Notification()

Notification オブジェクトの新しいインスタンスを生成します。

プロパティ

静的プロパティ

これらのプロパティは Notification オブジェクト自身のみで利用することができます。

Notification.permission 読取専用

文字列で、通知の表示についての現在の権限を表します。取りうる値は次の通りです。

• denied — ユーザーが通知の表示を拒否した。
• granted —通知が表示されることをユーザーが受け入れた。
• default — ユーザーの選択が不明であるため、ブラウザーは値が denied であるかのように動作します。

Notification.maxActions 読取専用

インスタンスプロパティ

これらのプロパティは Notification オブジェクトのインスタンスでのみ使用可能です。

Notification.actions 読取専用

コンストラクターの options 引数で指定された、通知のアクションの配列です。

Notification.badge 読取専用

通知自体を表示する空間が充分にない場合に通知を表す画像の URL です。

Notification.body 読取専用

コンストラクターの options 引数で指定された、通知の本文文字列です。

Notification.data 読取専用

通知のデータの構造化されたクローンを返します。

Notification.dir 読取専用

コンストラクターの options 引数で指定された、通知の書字方向です。

Notification.lang 読取専用

コンストラクターの options 引数で指定された、通知の言語コードです。

Notification.tag 読取専用

コンストラクターの options 引数で指定された、通知の ID です。

Notification.icon 読取専用

コンストラクターの options 引数で指定された、通知のアイコンの画像 URL です。

Notification.image 読取専用

コンストラクターの options 引数で指定された、通知の一部として表示される画像の URL です。

Notification.renotify 読取専用

古い通知が新しい通知に置き換えられた後、ユーザーに通知するかどうかを指定します。

Notification.requireInteraction 読取専用

Boolean で、ユーザーがクリックするか閉じるかするまで、通知が自動的に閉じずに残るべきであることを示します。

Notification.silent 読取専用

静かに通知をするかどうかを明示します。つまり、デバイスの設定に関係なく、通知の際に無音やバイブレーションさせない状態を設定できます。

Notification.timestamp 読取専用

通知が生成されたとき、または適用されるとき (過去、現在、未来) の時刻を示します。

Notification.title 読取専用

コンストラクターの第1引数で指定された通知のタイトルです。

Notification.vibrate 読取専用

バイブレーションハードウェアを持つ端末のためのバイブレーションパターンを指定します。

イベントハンドラー

Notification.onclick

click イベントのハンドラーです。ユーザーが通知をクリックするたびに起動されます。

Notification.onclose

close イベントのハンドラーです。ユーザーが通知を閉じたときに起動されます。

Notification.onerror

error イベントのハンドラーです。通知がエラーに遭遇するたびに起動されます。

Notification.onshow

show イベントのハンドラーです。通知が表示されたときに起動されます。

メソッド

静的メソッド

これらのメソッドは Notification オブジェクト自体に対してのみ使用できます。

Notification.requestPermission()

ユーザーに通知を表示する許可をリクエストします。

インスタンスメソッド

これらのメソッドは Notification オブジェクトのインスタンス、またはprototypeからのみ使用できます。 Notification オブジェクトは EventTarget インターフェイスも継承しています。

Notification.close()

プログラムで通知を閉じます。

例

以下の基本的な HTML を想定してください。

<button onclick="notifyMe()">Notify me!</button>

以下のように通知を送信することが可能で — ここでは、通知に対応しているかどうかを最初にチェックしたい場合に使用できる、かなり冗長で完全なコードのセットを提示します。次に、通知を送信する前に、現在のオリジンに通知を送信するための許可が付与されているかどうかをチェックし、必要に応じて許可を要求します。

function notifyMe() {
  // ブラウザーが通知に対応しているかどうかをチェックしましょう
  if (!("Notification" in window)) {
    alert("このブラウザーはデスクトップ通知に対応していません。");
  }

  // 通知の許可が既に得られているかどうかをチェックしましょう
  else if (Notification.permission === "granted") {
    // If it's okay let's create a notification
    var notification = new Notification("こんにちは！");
  }

  // そうでなければ、ユーザーに許可を求める必要があります
  else if (Notification.permission !== "denied") {
    Notification.requestPermission().then(function (permission) {
      // ユーザーが許可したら、通知を作成しましょう
      if (permission === "granted") {
        var notification = new Notification("こんにちは！");
      }
    });
  }

  // 最後に、ユーザーが通知を拒否していて、あなたが敬意を
  // 払いたい場合は、これ以上相手を煩わせることはありません。
}

このページでライブ例を公開するのはやめました。 Chrome や Firefox が別オリジンの <iframe> から要求された通知の許可をしないようになり、その他のブラウザーも従っているからです。動作する例を見る場合は、 To-do リストの例 (また、ライブで動作するアプリ) を参照してください。

仕様書

ブラウザーの互換性

関連情報

• 通知 API の使用