プログラム

ブラウザのプッシュ通知が簡単にできちゃうFirebase

ブラウザのプッシュ通知が簡単にできちゃうFirebaseのでやり方を簡略的に記載します。

  1. Firebaseにプロジェクトを作成する(グーグルのアカウントが必要)。
  2. firebase cliというパッケージソフトをOSにダウンロードしそのソフトを任意のフォルダの中に移動させて起動させる。Node.jsはインストール済みとする(※手順)。
  3. 試しにホスティングしてみる。ホスティングはプロジェクトの左側の項目よりホスティングをクリックすると手順の説明通り行うと出来ます。
  4. URLより確認し表示されているか確認する。
  5. Cloud Messagingの設定よりFCM でウェブ認証情報を設定するからメッセージング オブジェクトを取得するまでをブラウザで操作し設定を行う。
  6. ローカルに下記のURLよりファイルをダウンロードする。ダウンロードするファイルはfirebase-messaging-sw.js, firebase-logo.png, index.html, main.cssになります。動かない場合は再設定が必要。
    https://github.com/firebase/quickstart-js/tree/f76b14ca00cca48dbfca5c787c0a4ca73eb9857d/messaging
  7. ダウンロードしたファイルはpublicか自分が決めたフォルダに入れる。
  8. index.htmlソースの中に ‘<YOUR_PUBLIC_VAPID_KEY_HERE>’ と記載している部分があるので変更する。
  9. firebase cli より『 firebase deploy』する。
  10. ページを再読み込みして通知を許可する。
  11. Cloud Messagingから送信してみる。
  12. 通知が届くことを確認する。
    ※今回はブラウザのプッシュ通知なのでアプリを追加する際はWEB(</>)を選んでください。

ではでは~健闘を祈る😆

関連記事

  1. 雑記

    結局、できずじまい。って本(イラスト)なんか自分に。

    結局、できずじまい。ヨシタケ シンスケ(著者)。ある人のツイートか…

  2. 雑記

    繋がり。

    繋がり結び。寄り集まって形を作り、捻れて絡まって、時には戻って、…

  3. 雑記

    映画、猿の惑星:聖戦記を観てきましたよ。

    映画、猿の惑星:聖戦記を観てきましたよ。おそらく三部作のラストであ…

  4. 雑記

    目のコアが痛い。

    この頃、長時間PCと向き合っていると目の神経か血管が「ぷち」って切…

  5. 雑記

    大志を抱くな(゚Д゚)えっ!目標達成までの道のり。

    大志を抱くな!あまり大きな大志を抱くな!大きすぎて挫折してしまう…

  6. 雑記

    ヴァレリアン 千の惑星の救世主

    ヴァレリアン 千の惑星の救世主を観に行きました(字幕版。好みといえ…

プロフィール



taokaと申します。

まったりWEB日誌とまったり映画ログを
更新している中の人です😃

趣味は映画鑑賞とブログ書きです。


ブックマークやシェアして頂けると励みになります。

どうぞよろしくお願い致します。

Twitter でフォロー

PAGE TOP