[HTML5と関連API] Web Notificationsのサンプル

今回は Web Notifications の簡単なサンプルをつくってみました。

Web Notifications

Web Notifications はユーザーのデスクトップに通知を表示することができる API で、
(Win で例えると、タスクトレイにバルーンが表示される感じ)
現在策定中の仕様ですが、正式勧告されて各ブラウザで実装されれば、
ユーザーが他のサイトを閲覧している、若しくは、ブラウザを最小化しているなどの状態でも、
Webサイト・アプリケーション側からユーザーに対して通知を表示することができるようになります。

Web Notifications のデモ

簡単なサンプルを作ってみました。

2013年8月末時点で、Chrome28・Firefox23 にて動作確認

デモページの"通知"ボタンをクリックすることで、タスクトレイの上にサイトからの通知が表示されます。
Web Notifications が実装されていないブラウザではアラートで使用できない旨が表示されます。

ブラウザの実装状況

2013年8月末時点では Chrome と Firefox で実装されていますが、
Chrome にはベンダープレフィックス付きの webkitNotifications も独自で実装されていて、
そちらは HTML5 で仕様策定中の Web Notifications とは仕様が異なっています。

時間があれば詳しい使用方法やソースコードの説明を追加したいと思います。

例えば、この API を Node.js などと連携して使用すれば、誰かからメッセージが届いた時に通知を表示するといったように、サーバサイドで何かイベントが発生したことをユーザーに通知することが可能となります。
正式勧告されれば Webアプリケーション で可能な事が更に広がる楽しみな仕様です。

トラックバックURL

http://mashimonator.weblike.jp/mt/mt-tb.cgi/242

コメント投稿フォーム