Notification.requestPermission()

requestPermission() は Notification インターフェイスのメソッドで、ユーザーに現在のオリジンが通知を表示することを許可するよう要求します。

最新の仕様では、このメソッドは次のようにプロミスベースの構文に更新されています。

Notification.requestPermission().then(function(permission) { ... });

以前は、この構文は単純なコールバックに基づくものでした。このバージョンは非推奨になりました。

Notification.requestPermission(callback);

callback 省略可 非推奨 Gecko 46

省略可能なコールバック関数で、許可の値で呼び出されます。プロミスを返値にしたために非推奨になりました。

Promise で、ユーザーが許可を選択したら DOMString に解決します。この文字列の取りうる値は次の通りです。

• granted
• denied
• default

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

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

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

function notifyMe() {
  // Let's check if the browser supports notifications
  if (!("Notification" in window)) {
    alert("This browser does not support desktop notification");
  }

  // Let's check whether notification permissions have already been granted
  else if (Notification.permission === "granted") {
    // If it's okay let's create a notification
    var notification = new Notification("Hi there!");
  }

  // Otherwise, we need to ask the user for permission
  else if (Notification.permission !== "denied") {
    Notification.requestPermission().then(function (permission) {
      // If the user accepts, let's create a notification
      if (permission === "granted") {
        var notification = new Notification("Hi there!");
      }
    });
  }

  // At last, if the user has denied notifications, and you
  // want to be respectful there is no need to bother them any more.
}

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

• 通知 API の使用