Notification API Test
1. このページの目的
2. Notification API の説明
概要
- ユーザーへデスクトップ通知を行う。
- そのときのドメインに対してデスクトップ通知が許可されているかどうかを取得することもできる。
- ユーザーに対してデスクトップ通知の表示を許可をリクエストすることもできる。
- どのドメインに対してデスクトップ通知が許可されているのかを管理しているのはブラウザである。
全体
- Notification API が担っている動作は意外と単純
- 主な動作は以下の2つしかない。
- ブラウザがそのドメインに対して「デスクトップ通知」を許可しているかどうかを判定する。
- (許可していれば)デスクトップ通知を表示する
Notification()コンストラクター
- Notificationクラスのオブジェクトを生成すると、デスクトップ通知が発生する。
- ブラウザでそのドメインに対する「通知」が許可されていないと、Notificationクラスのオブジェクトを作成してもデスクトップ通知は実行されない。
構文
var myNotification = new Notification(title, options);
コード例
var options = {
body: '本文です。',
icon: '{アイコンのURL}'
}
var n = new Notification('タイトル', options);
3. デモ
Notification.permission の現在の値
- ブラウザの設定で、このドメインに対してデスクトップ通知を許可しているかどうか。
Notification.permission の値
値 |
意味 |
default |
ユーザーの選択は不明のため、ブラウザは拒否されたかのように動作する。 |
granted |
ユーザーは通知が表示されることを許諾している。 |
denied |
ユーザーは通知が表示されることを拒否している。 |
デスクトップ通知を表示してみる
通常の動作(上のボタンにも実装してある動作)
現時点での「通知」設定 |
とるべき動作 |
確認(デフォルト) |
ユーザーにデスクトップ通知を表示する許可をリクエストする。
- 許可であれば、デスクトップ通知を表示する。
- ブロックであれば、何もしない。
|
許可 |
デスクトップ通知を表示する。 |
ブロック |
何もしない。 |
デスクトップ通知した際に生成した Notificationオブジェクトのプロパティ
プロパティ |
値 |
Notification.dir |
|
Notification.lang |
|
Notification.body |
|
Notification.tag |
|
Notification.icon |
|
Notification.data |
|
Notification.silent |
|
4. 参考