Notifications API

この翻訳は不完全です。英語から この記事を翻訳 してください。

Notifications API を使えば、ウェブページがエンドユーザーに表示するシステム通知を制御できるようになります。これらのシステムは、トップレベルのブラウジングコンテキストの viewport の外に構築されているため、ユーザーがタブを切り替えたり、別のアプリに移動していたとしても表示されます。また、この API は既存の通知システムと互換性を持つようにデザインされているので、異なるプラットフォームでも動作します。

コンセプトと使い方

サポート済みのプラットフォームでは、一般にシステム通知の表示は2つ要素と関わりがあります。1つは、ユーザーが現在のオリジンに対して許可を与えなければならないということです。通常、通知の許可はアプリやサイトを初めて開いた時に Notification.requestPermission() を使用して行われます。このメソッドを実行すると、次のようなリクエストダイアログが表示されます。

ここでは、ユーザーはこのオリジンからの通知を許可するかどうかを選択できます。一度決定がなされると、現在のセッションの間はその設定が保存されます。

メモ: Firefox 44 からは、通知とプッシュの許可が統合されました。通知に許可が与えられれば、プッシュも同時に有効になります。

つぎに、新しい通知は、Notification() コンストラクタを使って作られます。このコンストラクタには、必須の title 引数と、オプションを指定するオプション引数として options オブジェクトを与えることができます。オプションには、テキストの方向、本文テキスト、表示アイコン、通知サウンドなどが指定可能です。

註: この機能は Web Workers 内で利用可能です。

さらに、Notifications API の仕様には、いくつかの ServiceWorker API が定義されていて、service workers が通知を発行できるようになっています。

メモ: 自分のアプリでの通知の詳しい使い方については、Using the Notifications API を読んでください。

Notifications インターフェイス

Notification
通知オブジェクトを定義する

Service worker の追加要素

ServiceWorkerRegistration
ServiceWorkerRegistration.showNotification() および ServiceWorkerRegistration.getNotifications() メソッドが含まれており、通知の表示の制御に使用できます。
ServiceWorkerGlobalScope
ServiceWorkerGlobalScope.onnotificationclick ハンドラが含まれており、通知がクリックされた時にカスタム関数を実行させることができるようになります。
NotificationEvent
ExtendableEvent に基づく、特定のタイプのイベントオブジェクトです。すでに実行された通知を表現します。

仕様

仕様 ステータス コメント
Notifications API 現行の標準 Living standard

ブラウザーの互換性

機能 Chrome Firefox (Gecko) Internet Explorer Opera Safari
基本サポート 5webkit[1]
22
4.0 (2.0)moz[2]
22.0 (22.0)
未サポート 25 6[3]
Available in workers ? 41.0 (41.0) ? ? ?
Service worker additions

42.0

42.0 (42.0)[4] ? ? ?
機能 Android Android Webview Firefox Mobile (Gecko) Firefox OS IE Mobile Opera Mobile Safari Mobile Chrome for Android
基本サポート ?

(有)

4.0 (2.0)moz[2]
22.0 (22.0)
1.0.1moz[2]
1.2
未サポート ? 未サポート

(有)

Available in workers ? ? 41.0 (41.0) (有) ? ? ? ?
Service worker additions 未サポート 未サポート 42.0 (42.0)[4] (有) ? ? ? 42.0

[1] Prior to Chrome 22, the support for notification followed an old prefixed version of the specification and used the navigator.webkitNotifications object to instantiate a new notification. Prior to Chrome 32, Notification.permission was not supported.

[2] Prior to Firefox 22 (Firefox OS <1.2), the instantiation of a new notification was done with the navigator.mozNotification object through its createNotification() method. In addition, the Notification was displayed when calling the show() method, and supported only the click and close events (Nick Desaulniers wrote a Notification shim to cover both newer and older implementations.)

[3] Safari started to support notification with Safari 6, but only on Mac OSX 10.8+ (Mountain Lion).

[4] Firefox 42 has shipped with web notifications from Service Workers disabled.

Firefox OS の許可

Firefox OS アプリで通知を使用する時は、マニフェストファイルに desktop-notification 許可を与えるようにしてください。Notifications can be used at any permission level, hosted or above:

"permissions": {
  "desktop-notification": {}
}

関連項目

ドキュメントのタグと貢献者

 このページの貢献者: shuuji3
 最終更新者: shuuji3,