Google Chrome 28 から「リッチ通知」機能と言うものが追加されたそうです。Google Chrome には以前から通知機能があったそうなのですが*1、この機能の強化版的な位置づけでしょうか。実際にどんな感じになるのかについて、github にサンプル があったので使用して確認してみました。
サンプルをインストール*2すると、「新しいタブ」の「アプリケーション」の欄に「Notify Test App」と言うアイコンが表示されるのでクリックします。すると、以下のように通知する内容を編集するための画面が表示されます。
この画面の「Settings」の欄を適当に埋めて、「Basic Notification」をクリックすると以下のような通知が表示されます。
表示形式には basic, image, list の 3 種類があるようで、残り 2 つの形式の見え方は以下のようになります(Notify Test App には「Simple Notification」と言うボタンもあるのですが、これはうまく動いていないようでした)。
chrome.notifications - Google Chrome によると、通知に含められるものは以下のようです。
- type …… basic, image, list のどれか
- iconUrl …… 左側に表示されるアイコン画像への URL
- title …… 上部に表示されるタイトル
- message …… 本文(list では使用されない?)
- priority …… [-2, 2] の範囲内の整数値を指定する。初期値は 0
- buttons …… 作成するボタンの配列。配列の中身は、title とオプションで iconUrl。ここで生成されたボタンが押されると、onButtonClicked のイベントハンドラで対応する index が渡される模様
- imageUrl …… 本文中に表示する画像の URL(type が image の時のみ有効?)
- items …… 本文をリスト形式で表示する時に使用する(type が list の時のみ有効?)
これらの設定は、例えば、以下のようにして指定します。
You can trigger a rich notification by calling the create method under the chrome.notifications module:
chrome.notifications.create( ‘id1’,{ type: ‘basic’, iconUrl: ‘image1.png’, title: ‘Althe Frazon’, message: ‘Lorem ipsum’, buttons: [{ title: ‘Call’, iconUrl: ‘call.png’}, { title: ‘Send Email’, iconUrl: ‘email.png’}], priority: 0}, function() { /* Error checking goes here */} );Chromium Blog: Rich Notifications in Chrome
Google Chrome 通知機能に関する覚書
私自身が Google Chrome の通知機能と言うものの概要を理解してないため、当たり前みたいな事、あるいは間違った事が書かれているかもしれませんが……
Google Chrome 通知機能と言うのは、機能的には「JavaScript で表示コマンドを実行するとブラウザ内の代わりにタスクトレイ付近に表示させるもの」と言う感じのようです。最初に聞いた時は、「Google が各サーバから送られてきた通知を貯めるためのサーバを用意していて、Chrome がそのサーバと通信して必要な(≒許可されている)通知のみを表示する」と言ったような機能なのかなと思ってましたが、そう言った類のものではないようです。
なので、基本的には「通知の送信元 Web ページは、Google Chrome で開いた状態でなければならない」と言う条件があります。Mozilla Re-Mix: Google Chrome利用中にGoogleカレンダーの予定をデスクトップ通知させる方法。 と言う記事では、「Google カレンダーにログインしたままであれば、カレンダーを閉じて他のページを閲覧していても有効となります」との記述があったのですが、手元の環境では別タブか何かで Google カレンダーの Web ページを開いておかないと通知されませんでした。
この条件を回避?するには、Google Chrome Extensions で通知のチェックと表示を行うものを作成し、ユーザにインストールしてもらいます。作成方法については、Chrome Extensionでページの更新を監視してみる | mitc 等が参考になりました。