miso_soup3 Blog

主に ASP.NET 関連について書いています。

Chrome で Push API を試す

2015年4月にリリースされた Chrome 42 で可能になったという、”ブラウザを閉じていても届くプッシュ通知”というものを試してみました。

「Google Chrome 42」安定版リリース プッシュ通知機能追加と45件の脆弱性対処

※正式版ではないので以下の内容は間違っている可能性があります。

実装方法はググるとたくさんの記事がでてきます。この記事では試したときのメモを。

使用するものは、

  • Google Cloud Messaging (Android、iOS、Chrome の複数のプラットフォームにメッセージを送信)
  • Push API

Push API とは W3C が定める仕様で、Web Worker の中の一つ。Web Worker ではいくつか分類されていて、

Web Workers API

  • Shared Worker
  • Service Worker
  • Chrome Worker
  • Audio Worker
  • ...

この Service Worker 内で Push API を使います。
参考:
Service Worker の紹介
Push API

トライ

ChromeでW3C Push APIを使ってみた
http://qiita.com/tomoyukilabs/items/8fffb4280c1914b6aa3d

Your first push notifications web app
https://developers.google.com/web/fundamentals/getting-started/push-notifications/

この2つのサイトを交互しながら試してみました。後者のチュートリアルに従いつつ、前者を見ながら、という感じです。

以下、引っかかったところのメモです。

  • manifest.json の gcm_sender_id に指定するのは、Project ID ではなく、Project Number。
  • 「Google Cloud Messaging for Chrome」がなく、「Google Cloud Messaging for Android」で「ブラウザキー」を登録。Authorize ヘッダーにはこのキーを指定。
  • https://android.googleapis.com/gcm/send へ送信したときのエラーについて
    • 「error : MismatchSenderId 」→ Manifest.json が認証されていない可能性。localhost上ではなく、一度 Public な場所で公開する必要がある?
    • 401 → 「Authorization: key=******」が正しいかを怪しむ。
    • 400 → Body の中身が正しい形式かどうか怪しむ。JSONであればJSON書式として正しいか。
    • 「error : InvalidRegistration」→ registration_ids の中身である Registration ID を怪しむ。
  • https://android.googleapis.com/gcm/send/cAimx0m8Cys:******」セミコロンの後に Registration ID がある。
動的なメッセージの送信について

サーバー側から動的なメッセージを通知するには、
Web Pushでブラウザにプッシュ通知を送ってみる
HTTP/2 の Web Push を使用する必要があるみたいです。こちらは試していません。

以上、Google Cloud Messaging と Chrome で軽く試してみましたが、ブラウザ/Google Cloud Messaging/アプリケーションサーバー の関係性が良く分からず。
と、いろいろ見ていましたら、

Service WorkerとHTTP/2が切り開く新しいWeb Pushの世界
http://d.hatena.ne.jp/jovi0608/20141204/1417697480

2014/12の記事ですがこちらで詳しく説明されていました。