Loading
BLOG 開発者ブログ

2018年12月12日

FirebaseのCI/CDに爆速で入門する

FirebaseのCI/CDに爆速で入門する
Firebaseをただ使ってるだけで満足していませんか?
Firebaseを利用した開発を行う場合でも、適切なCI/CDを設計することで品質改善や作業コストの削減といったメリットを享受することができます。

この記事は アイソルート Advent Calendar 12日目の記事です。
こんにちは。
クラウドソリューショングループのwatanabe.tです。


はじめに

アプリケーションを開発していく上で、CI/CDの重要性は散々言われてきました。

なぜCIが必要なのか | DevelopersIO

今回はそんなCI/CDをFirebaseのプロジェクトでも実現する方法を解説していきたいと思います。

ビルド・デプロイを行う上でFirebase CLICircleCIを利用しますが、これらの詳しい解説は省略させてもらいます。
それぞれの詳細が気になる方は、ぜひこの機会に調べてみてください。


デプロイ用アカウントの作成

個人開発であればFirebase CLIを利用して個人のGoogleアカウントに紐づくトークンを使用することが多くあります。

しかし、チーム開発時に個人のGoogleアカウントへトークンを紐づけてしまうと、
Googleアカウントを削除するとトークンも削除されてしまったり、
セキュリティポリシーの観点から許可されない場合があります。

そこで、今回はFirebase CLI v6.1.0で追加されたGOOGLE_APPLICATION_CREDENTIALSを利用します。

これは、サービスアカウントに紐づく認証情報のjsonファイルを環境変数を通して渡すことで、
そのサービスアカウントでデプロイを可能にするというものです。

というわけで、まずはデプロイ用のサービスアカウントを作成します。

対象のFirebaseプロジェクトをコンソールから開き、左上の設定から ユーザーと権限 を選択します。

Firebaseコンソール

設定画面が開かれたら サービスアカウント のタブを開き、 全てのサービスアカウントを管理 をクリックし、
IAM管理画面に遷移してください。

Firebaseサービスアカウント

画面上部の サービスアカウントを作成を クリックし、以下のように詳細を入力して作成します。
また、サービスアカウントの権限については、Cloud Functionsのデプロイが行えるように Firebase Develop 管理者 としました。

Firebase権限設定


APIの有効化

今回はFirebaseにログインせず、API経由でデプロイする方法になります。
そのため、Cloud Resource Manager APIをあらかじめ有効化しておく必要があります。

先程サービスアカウントを作成したコンソールから APIとサービス を選択し、
Cloud Resource Manager API のページを開いた後、APIを有効化してください。


Firebase用API設定


CIサービス用認証トークンの準備

さて、デプロイ用アカウントの作成・APIの有効化が完了したところで、今度はCIサービスで使用するための鍵が必要になります。

先程作成したサービスアカウントの鍵をjson形式で作成し、ローカルにダウンロードしておいてください。


Firebase用サービスアカウントキー

ただ、作成した鍵はjsonファイルとなっているため、このままだとCIサービスでは参照することができません。
※間違っても鍵をGitHubなどで公開しないようにしてくださいね。

そこで、鍵を一度base64エンコーディングした後、環境変数として設定し、
CIサービス内でデコードしてファイルを作成するようにします。

$ cat account-key.json | base64

これをCircleCIの環境変数に設定しておくのを忘れないようにしてください。
また、FirebaseのProjectIDもついでに環境変数に設定しておきましょう。


CircleCIで実行する

さて、ここまで来たら後はCircleCIで実際に実行してみましょう。

今回のCircleCIの設定は簡潔に以下のようにしました。
ポイントは、環境変数に渡してある鍵をbase64デコードしてる点と、 GOOGLE_APPLICATION_CREDENTIALS の環境変数を設定している点です。

version: 2
jobs:
  build:
    docker:
      - image: circleci/node:8

    working_directory: ~/workspace

    steps:
      - checkout

      - run:
          name: Install firebase-tools
          command: sudo npm install -g firebase-tools

      - run:
          name: Decode key file
          command: echo $FIREBASE_KEY | base64 -d > ${HOME}/account-auth.json

      - run:
          name: Setup local environment
          command: echo "export GOOGLE_APPLICATION_CREDENTIALS=${HOME}/account-auth.json" >> $BASH_ENV

      - run:
          name: Deploy Firebase Hosting
          command: |
              echo $GOOGLE_APPLICATION_CREDENTIALS
              firebase deploy --only hosting --project $FIREBASE_PROJECT_ID


この設定を記述したGitHubプロジェクトをプッシュすると、CircleCIでジョブが実行され、
無事にデプロイが成功していることが確認できます。


Firebase on CircleCI

また、Firebaseのコンソールからも無事にデプロイが完了していることが確認できます。


Firebaseのデプロイ結果


最後に

今回紹介した例ではHostingしかデプロイしませんでしたが、Cloud Functions, Cloud FirestoreのRuleなども同様に設定することが可能です。

ぜひご自身のプロジェクトにもCI/CDを導入し、開発速度を加速させていってください。

明日はkikuchi.sさんの「【GoogleHome】今日からでも!自宅に爆速IoT導入」です、よろしくお願いします。



watanabe.tのブログ

クラウドソリューショングループ所属

昔はモバイルアプリ開発を、今はGCP, AWS, Firebaseなどのクラウド周りの提案/開発を行っているエンジニアです。

AWS認定ソリューションアーキテクト取得しました!