Github ActionsとWorkload Identityを利用してCDを実現する

概要

GCPを利用してアプリケーションを作成しているのですが、まず本格的な開発を進める前にデプロイまでのパイプラインを作りたいと思います。
Github でdevelopブランチにマージがされると Github Actionsを利用してアプリケーションが自動的にデプロイする仕組みを作ります。

利用する機能

• Github Actions
  • 実行環境
• Workload Identity(サービスアカウント)
  • サービスアカウントのキーでも認証はできますが、Workload Identityを使ったほうがセキュリティ上安全です。
  • サービスアカウントではキー情報をGithubのシークレット情報として持たせるため漏洩時のリスクが高いですがWorkload Identityの場合有効期限が短いため安全性が高いです。
  • GitHub Actions からのキーなしの認証の有効化 | Google Cloud 公式ブログ
• GAE
  • 今回はVue.js をデプロイします

環境変数をセット

設定したい値及びプロジェクト名を環境変数にセットします。

export PROJECT_ID="PROJECT_ID"
export SERVICE_ACCOUNT="SERVICE_ACCOUNT"
export POOL="POOL"
export PROVIDER="PROVIDER"
export REPO="USER_NAME/REPO_NAME"

サービスアカウントを作成

Workload Identityに紐付けるサービスアカウントを作成します

gcloud iam service-accounts create "${SERVICE_ACCOUNT}" \
  --project "${PROJECT_ID}"

GAEをデプロイするためには以下の権限が必要です。
- App Engine 管理者
- Cloud Build サービス アカウント
- サービス アカウント ユーザー
- ストレージ管理者

Workload Identityプールを作成

gcloud iam workload-identity-pools create $POOL \
  --project="${PROJECT_ID}" \
  --location="global" \
  --display-name=$POOL

作成したPOOL IDを環境変数に入れます。

export WORKLOAD_IDENTITY_POOL_ID=$(gcloud iam workload-identity-pools describe "$(POOL)" --project="${PROJECT_ID}" --location="global" --format="value(name)")

Workload Identityプロバイダを作成

 gcloud iam workload-identity-pools providers create-oidc $PROVIDER \
  --project="${PROJECT_ID}" \
  --location="global" \
  --workload-identity-pool=$POOL \
  --display-name="provider" \
  --attribute-mapping="google.subject=assertion.sub,attribute.actor=assertion.actor,attribute.aud=assertion.aud" \
  --issuer-uri="https://token.actions.githubusercontent.com"

IAMポリシーバインディングを作成

cloud iam service-accounts add-iam-policy-binding "${SERVICE_ACCOUNT_NAME}@${PROJECT_ID}.iam.gserviceaccount.com" \
  --project="${PROJECT_ID}" \
  --role="roles/iam.workloadIdentityUser" \
  --member="principalSet://iam.googleapis.com/${WORKLOAD_IDENTITY_POOL_ID}/attribute.repository/${REPO}"

Github Actionsにてworkflowを作成

以下を配置してmain ブランチにpushするとvue.jsがbuildが行われ、その後デプロイされたvue.jsがGAEにデプロイされるはずです
- secrets/variablesはレポジトリ画面から Settings -> Secrets and variables -> Actions で登録ができます。レポジトリ全体で利用できる環境変数になります
- 今回vue-jsフォルダ配下にvue.jsのコードがあります。そのためディレクトリを移動する必要がありますが、working-directory を使うことでcd で移動せずとも実行ディレクトリを指定できます

# .github/workflows/deploy-frontend.yml
name: Deploy frontend to GAE with Workload Identity

on:
  push:
    branches:
      - main

jobs:
  Deploy-frontend:
    runs-on: ubuntu-latest
    permissions:
      id-token: write
      contents: read

    steps:
      - name: Checkout repository
        uses: actions/checkout@v3

      - name: Set up Node.js
        uses: actions/setup-node@v2
        with:
          node-version: "16"
  
      - name: Install npm
        run: |
          npm install 
          npm install -g @vue/cli
          npx vue-cli-service build
          npm run build
        working-directory: ./vue-js

      - id: 'auth'
        name: 'Authenticate to Google Cloud'
        uses: 'google-github-actions/auth@v1'
        with:
          workload_identity_provider: 'projects/${{ secrets.PROJECT_NO }}/locations/global/workloadIdentityPools/${{ vars.WORKLOADIDENTITYPOOL_ID }}/providers/${{ vars.PROVIDER_ID }}'
          service_account: '${{ secrets.SEVICE_ACCOUNT }}@${{ secrets.PROJECT_ID }}.iam.gserviceaccount.com'

      - name: Set up Google Cloud SDK
        uses: google-github-actions/setup-gcloud@v0.5.0

      - name: Deploy to GAE
        run: |
          gcloud app deploy vue-js --quiet

※npmあたりは余計なコード多いかもです。