git pushできない環境変数をGitHub Actionsで利用する方法

ローカル環境で例えば「.env」ファイルなどにAPIキーなどの秘密情報を書いておいて環境変数としてアプリで利用している場合、通常GitHubに「.env」ファイルをpushしないと思います。ただこの場合GitHub Actionsを使って自動ビルドを行おうとすると「.env」ファイルがないため困ることになります。

そこで本記事ではGitHub上で環境変数を登録してビルド時に環境変数を読み込む方法を紹介します。例としてFirebaseのクライアントツールで自動生成したGitHub Actions用のYAMLファイルを引き合いに出します。

GitHubに環境変数を登録

GitHubの対象リポジトリで「Settings > Secrets」と画面を開きGitHubに環境変数を登録します。下図の赤枠は本記事の例で利用する環境変数です。

GitHub_secrets

GitHub Actionsのワークフロー作成

下記はFirebaseのクライアントツールで自動生成したGitHub Actionsのワークフローを定義したYAMLファイルに赤字部分を追加したものです。青字部分がビルドコマンドになりますが、ビルド時に利用する環境変数を赤字のようにして上記で登録した環境変数を読み込むことでセットしています。すなわち${{ secrets.<環境変数名> }}の書式で読み込むことができます。

// firebase-hosting-pull-request.yml

# This file was auto-generated by the Firebase CLI
# https://github.com/firebase/firebase-tools

name: Deploy to Firebase Hosting on PR
'on': pull_request
jobs:
  build_and_preview:
    runs-on: ubuntu-latest
    env:
      REACT_APP_FIREBASE_KEY: ${{ secrets.REACT_APP_FIREBASE_KEY }}
      REACT_APP_FIREBASE_DOMAIN: ${{ secrets.REACT_APP_FIREBASE_DOMAIN }}
      REACT_APP_FIREBASE_DATABASE: ${{ secrets.REACT_APP_FIREBASE_DATABASE }}
      REACT_APP_FIREBASE_PROJECT_ID: ${{ secrets.REACT_APP_FIREBASE_PROJECT_ID }}
      REACT_APP_FIREBASE_STORAGE_BUCKET: ${{ secrets.REACT_APP_FIREBASE_STORAGE_BUCKET }}
      REACT_APP_FIREBASE_SENDER_ID: ${{ secrets.REACT_APP_FIREBASE_SENDER_ID }}
    steps:
      - uses: actions/checkout@v2
      - run: yarn --frozen-lockfile && yarn run build
      - uses: FirebaseExtended/action-hosting-deploy@v0
        with:
          repoToken: '${{ secrets.GITHUB_TOKEN }}'
          firebaseServiceAccount: >-
            ${{ secrets.FIREBASE_SERVICE_ACCOUNT_REACT_FIREBASE_AUTH_SAMP_73FC1
            }}
          projectId: react-firebase-auth-samp-73fc1
        env:
          FIREBASE_CLI_PREVIEWS: hostingchannels

 

sponsor