github actionsを使ってNext.jsをfirebase hostingにdeployする

概要

Next.js + firebaseでSSR、SSG、ISRがサポートされたので試してみる の記事で、firebase hostingがNext.jsのデプロイをサポートしたので試してみましたが、github actions経由でデプロイするときにハマったのでメモを残します

experiments:enable webframeworks は環境変数を設定する

Next.js を統合する  |  Firebase Hostingの手順を見ると、firebase-toolsで以下の設定が必要になるが、github actionsからのdeploy時の指定方法が示されていない

firebase experiments:enable webframeworks

github actionsのコンソールにこんな感じのエラーがでます

Error: Cannot deploy a web framework to hosting because the experiment webframeworks is not enabled. To enable webframeworks run firebase experiments:enable webframeworks

対応方法

環境変数にFIREBASE_CLI_EXPERIMENTS: webframeworksを設定します

firebase-hosting-merge.yml

name: Deploy to Firebase Hosting on merge
'on':
  push:
    branches:
      - main
jobs:
  build_and_deploy:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2
      - run: yarn
      - run: yarn build
      - uses: FirebaseExtended/action-hosting-deploy@v0
        with:
          repoToken: '${{ secrets.GITHUB_TOKEN }}'
          firebaseServiceAccount: '${{ secrets.FIREBASE_SERVICE_ACCOUNT_XXXXX }}'
          channelId: live
          projectId: xxxxx
        env:
          FIREBASE_CLI_EXPERIMENTS: webframeworks

参考

How can run firebase experiments:enable webframeworks with GitHub actions? | stackoverflow　

AUTH_PERMISSION_DENIED などの 403エラーが発生する

直観でわかりづらいのがこのエラーで、どうやらgithub actionsのサービスアカウントにいろいろと権限が足りないようです

You can add the permissions by granting the role 'roles/artifactregistry.reader'.

対応方法

GCPのIAMで[e-mail]のRoleにEditorの権限を追加します

Google Cloud Console

果たしてこの対応が本当に正しいかは謎

不明の原因でデプロイが失敗する

GCPのコンソールからデプロイに失敗したcloud functionsを削除する

以下のコマンドで消せそうだったけど、消せなかったので半ばあきらめてましたが、GCPのコンソールからは消せました

firebase functions:delete [function名]