FirebaseはGoogleが提供するBaaSと呼ばれるクラウドサービスです。
これからは自分でサーバーを構築する時代でもないと思ったので、Firebaseを試してみました。
まずは、firebaseに登録してウェブアプリをデプロイするところまでやってみたのですが、ちょっとハマったところもあったのでまとめておきました。
まず、Google Cloud Platformに登録して 新しいプロジェクトを作成します。
作成方法についてはこちらを参照してください。
次に、GCP Cloud Shellを開きます。
これはブラウザからクラウドのインスタンス上でシェルを使うためのものです。
GCPダッシュボードの右上のプロンプトマークをクリックします。
すると、下にシェルのターミナルが開きます。
サンプルウェブアプリのソースを以下のコマンドでダウンロードしておきます。
# git clone https://github.com/firebase/friendlychat-web
次にFirebase(https://firebase.google.com)のサイトにブラウザでアクセスして、プロジェクトを作成します。
プロジェクトを作成すると以下のようなページが表示されます。
Firebaseは以下のようなサービスで構成されています。
- Authentication - 認証機能
- Database - データベース機能
- Storage - 静的コンテンツやファイルを保存する機能
- Hosting - コンテンツの配信やデプロイ
- Functions - クラウド関数
サンプルアプリを動かすためにAuthentication,Database,Storageを設定します。
左サイドメニューの「Database」をクリックしてRealtime Databaseの「データベースの作成」をクリックします。
「テストモード」を選択し、「データベースを作成」をクリックします。
データベース作成完了です。
次に、認証機能を設定します。
左メニューのAuthenticationをクリックし、「ログイン設定ボタン」をクリックします。
「ログイン方法」タブを選択した後、ログインプロバイダーとしてGoogleを選択し「有効にする」スライダーをオンにします。「プロジェクトの公開名」はFriendly Chatと入力します。
Google認証が有効になりました。
次に、Storageの設定を行います。
「スタートガイド」ボタンをクリックします。
「セキュリティルール」ダイアログのOKボタンをクリックします。
これでFirebase側の設定は完了です。
次に、サービスアカウントを作成します。
サービスアカウントとは、アプリケーションや仮想マシンに属する特別なGoogleアカウントです。GCPからFirebaseにアクセスするには事前に作成しておく必要があります。
GCPダッシュボードのメニュー「APIとサービス」- 「認証情報」をクリックします。
「認証情報」の「認証情報の作成」-「サービスアカウントキー」を選びます。
「サービスアカウント」メニューで「新しいサービスアカウント」を選択し、「役割」メニューは「Project」-「オーナー」を選択します。
アカウントが作成された後、暗号鍵が含まれたJSONファイルがダウンロードされますので、PCの適当なところに保存してください。
PC上のエディタでダウンロードしたJSONファイルを開いてテキストをコピーします。
次に、GCPコンソール上でvi等のエディターを開いてペーストしてファイル保存してください。(ファイルパス $HOME/friendly_chat_web/web/fbtest.json)
そして、GCPシェル上で保存したJSONファイルのパスを環境変数GOOGLE_APPLICATION_CREDENTIALSに以下のように設定します。
# export GOOGLE_APPLICATION_CREDENTIALS=$HOME/friendly_chat_web/web/fbtest.json
次に、アプリのディレクトリで以下のコマンドを実行します。
# cd friendly_chat_web/web
# firebase login --no-localhost
ブラウザでアクセスして認証するためのURLが表示されるので
表示されたURLにアクセスしてサービスアカウントのアクセスを許可してください。
そして、以下のコマンドをGCPシェルで実行してください。
# firebase init
ラジオボタンになっているところの「Database」と「Storage」に上下カーソルキーで移動しスペースキーでチェックを入れてリターンします。
Select a default Firebase project for this directory:で(don't setup a default project)を選びます。
その後、何回か聞かれますがリターンで問題ないです。
そして、アプリケーションのデプロイを行います。
# firebase deploy --project プロジェクトID
プロジェクトIDは、Firebaseのプロジェクトの設定で確認できます。
Hosting URLをブラウザでアクセスするとウェブアプリが動作していることを確認できます。
GCPとFirebaseの接続設定のところで結構はまりましたが、認証やデータベースをFirebaseに任せられるのはいいですね。
さらに色々いじってみたいと思います。
参考URL:
