🔥

[Flutter] Firebaseに接続されたアプリのCIをCodemagicで

2021/08/07に公開

前提

この記事は、Flutterでアプリ開発を行う際の環境設定 の続きで、Codemagicを使ってCIを設定していく記事です。
上記の記事で環境分けを行った人は、各環境にFirebaseを接続するところまで完了していると思います。
初心者のための記事なので、アプリの配布などの説明はなく、GitHubにpushされプルリクエストが作成されると、静的解析やテストが走るようにするのが目的です。

CIの設定

Codemagic

まずは、Codemagicにサインインしてアプリの設定準備を行ってください。
https://blog.codemagic.io/getting-started-japanese/
上記のリンクに公式の説明頁があるので、参考に最低限の設定は進めてください。

Firebaseの設定ファイルを暗号化し環境変数に設定

通常、Firebaseの設定ファイルは公開してはいけません。ですので、GitHubにpushすることもしません。
そのためには、gitignoreファイルを使用して、ファイルがGitHubにpushされないようにしていきます。
まず、ios/.gitignoreにGoogleService-Info.plistと追記します。
次に、各ios/Runner/Firebase/以下のディレクトリに.gitignoreファイルを作成し、以下を記入します。

*
!.gitignore

最後に、android/.gitignoreファイルにgoogle-services.jsonを追記することで、設定ファイルがpushされることを防ぐことが出来ます。
CodemagicはGitHubからファイルを参照してテストやビルドなどを行いますが、Firebaseの設定ファイルをGitHubにアップしないとなると、ビルドが失敗してしまします。
これを防ぐために、Firebaseの設定ファイルの中身を暗号化し、Codemagic上で変数として保持し、それを適切なタイミングで使うことで、この問題を解消します。

設定画面の右側に「Encrypt environment variables」という項目があるので、そちらをクリックします。そうすると以下の画像のような画面になるので、ここに自分のFirebaseの設定ファイルをドラッグアンドドロップします。

そうすることで、そのファイルを暗号化した結果が表示されるので、それをコピーしてください。
次に、Environment variablesを開き、以下の画像のように環境変数を設定してください。

これらの名前通りに自分の設定ファイルを上記と同様に暗号化し、コピーして環境変数に設定してください。また、今回私はFirebaseは本番環境と開発環境の2つで作っているので、3つの場合は同じように自分で環境変数を命名して追加してください。

ビルド前に環境変数を利用

Firebaseの設定ファイルはビルド前に必要になるので、Buildと書かれている上の歯車のアイコンをクリックします。すると、そこにPre-build script欄があるので、ここにビルド前に実行したい処理を書いていきます。

#!/bin/sh

echo "ANDROID setup\n"
echo $FIREBASE_ANDROID_DEV | base64 --decode --output $FCI_BUILD_DIR/android/app/src/development/google-services.json
echo $FIREBASE_ANDROID_STG | base64 --decode --output $FCI_BUILD_DIR/android/app/src/staging/google-services.json
echo $FIREBASE_ANDROID_PROD | base64 --decode --output $FCI_BUILD_DIR/android/app/src/production/google-services.json

echo Decoded google-services.json! Here is the directory after.
cat $FCI_BUILD_DIR/android/app/src/development/google-services.json
echo "\n"

echo "IOS setup"
echo $FIREBASE_IOS_DEV | base64 --decode --output $FCI_BUILD_DIR/ios/Runner/Firebase/development/GoogleService-Info-dev.plist
echo $FIREBASE_IOS_STG | base64 --decode --output $FCI_BUILD_DIR/ios/Runner/Firebase/staging/GoogleService-Info-stg.plist
echo $FIREBASE_IOS_PROD | base64 --decode --output $FCI_BUILD_DIR/ios/Runner/Firebase/production/GoogleService-Info-prod.plist
    
echo "\nListing iOS Directory to confirm the GoogleService-Info.plist is there! \n"

echo "\ncreate empty GoogleService-Info.plist"
touch $FCI_BUILD_DIR/ios/Runner/GoogleService-Info.plist

上記の処理は、設定した環境変数からローカルにあるビルド可能なフォルダ構成を再現するための記述です。環境変数名などを変更している人は自分が決めた名前に変更してこちらをコピーし貼り付けてください。
最後に、Buildの欄のBuild argumentsを以下の画像と同じように設定することで、設定は完了です。

最後に

これで環境分けが完了したと思います。自分が初めて行った際、3日ぐらいかかりやっとここまでできたので、この記事がその時間を縮めていると幸いです。
間違ってること、ご指摘、質問などありましたらTwitterかコメントにお願いします。

Discussion