Firebaseを使ったプッシュ通知

2017/11/09

前提条件として「httpsサイトでのみ利用可能」だそうだ。
「localhost」でもいけるらしいが、Xamppで試しても・・・

{
“multicast_id”:xxxxxxx,
“success”:0,
“failure”:1,
“canonical_ids”:0,
“results”:[{“error”:”MismatchSenderId”}]
}

上記のようになりどうしたらいいかがわかならい。

JavaScript Firebase Cloud Messaging クライアント アプリを設定する」に従いつつやってみる。

httpsサイトでのみ利用可能

サーバーを用意しなくちゃいけないけど単純にテストするためだけに金をだして契約・・・ってのは避けたい。ありがたいことに下記のように用意してくれるそうだ。

プロバイダが必要な場合、 Firebase Hosting を使用すると、独自ドメインで無料の HTTPS ホスティングを簡単に行うことができます。

Firebase Hostingを使うことにする。

FirebaseをJavaScriptプロジェクト追加

Firebaseからプロジェクトを追加・・・なんだけど、すでに作っていたからスキップ。

サンプルソースが載っていたのでDLしてFirebase Hostingにup(デプロイ)する。
※どれが必要かわからないので全部DL・・・「firebase/quickstart-js」→DLしたファイルたちのうち「messaging」フォルダの中身だけup(デプロイ)する。

「https://〇〇〇.firebaseapp.com/」にアクセスして「REQUEST PERMISSION」をクリック。許可を求められるので「許可」する。

JavaScript クライアントでメッセージを受信する

次のステップは・・・「JavaScript Firebase Cloud Messaging クライアント アプリを設定する」ではなく「JavaScript クライアントでメッセージを受信する」になる。

・・・色々書かれているけど「firebase/quickstart-js」をup(デプロイ)していたのですることが無さげ。そのためスキップ。

「firebase-messaging-sw.js」の中の「’messagingSenderId’: ‘YOUR-SENDER-ID’」だけ書き換えが必要かも。

「https://〇〇〇.firebaseapp.com/」にアクセスまではOK。その後、メッセージをPCで表示してもらうトコで・・・挫折。

別のアプローチを考えてみる・・・。
出来るようになったらまとめよう・・・。

新着(ニュース関連以外)

2018-07-26
年賀状で「新春」とか書くけど・・・何故なんだろうと8月を目前にした今、疑問に思った。
2018-05-16
PHPで画像のヘッダ情報(?)の「Orientation」を元に画像回転させたい。
2018-03-05
Android Studioをインストール。エミュレータを軽くするトコまで終わらせたかったけど、挫折した。
2018-02-23
プッシュ通知について調べてた時にでてきたServiceWorker。そのServiceWorkerについてのメモ。
2017-12-13
jqueryで取得したDOM要素をオブジェクトじゃなくて、配列で受け取りたい