GitHub Actions에서 build시 사용할 환경 변수 넣기

 

자꾸 build에서 실패했다.

로그를 살펴보면 401 에러였는데 API키는 환경변수에 넣어놓았기 때문에 next 내부에서 일어나는 어떤 문제라고 생각하고

Error: 401 Unauthorized: {"data":[{"id":"5413bc","type":"api_error","attributes":{"code":"INVALID_AUTHORIZATION_HEADER","details":{}}}]}
    at s (/home/runner/work/blog/blog/.next/server/chunks/724.js:8:121)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async Object.c [as generateStaticParams] (/home/runner/work/blog/blog/.next/server/app/posts/[category]/[subCategory]/page.js:24:432)
    at async buildParams (/home/runner/work/blog/blog/node_modules/.pnpm/next@14.0.4_@babel+core@7.23.6_react-dom@18.2.0_react@18.2.0_sass@1.69.5/node_modules/next/dist/build/utils.js:987:36)
    at async /home/runner/work/blog/blog/node_modules/.pnpm/next@14.0.4_@babel+core@7.23.6_react-dom@18.2.0_react@18.2.0_sass@1.69.5/node_modules/next/dist/build/utils.js:1004:33
    at async /home/runner/work/blog/blog/node_modules/.pnpm/next@14.0.4_@babel+core@7.23.6_react-dom@18.2.0_react@18.2.0_sass@1.69.5/node_modules/next/dist/build/utils.js:1134:114
    at async Span.traceAsyncFn (/home/runner/work/blog/blog/node_modules/.pnpm/next@14.0.4_@babel+core@7.23.6_react-dom@18.2.0_react@18.2.0_sass@1.69.5/node_modules/next/dist/trace/trace.js:147:20)

 

vercel token, github token등을 갈아끼웠다.

 

그래도 해결이 되지 않았는데 여러 디버깅끝에 결국 API key문제라는 것을 알아냈다.

 

왜 github actions에 api key가 들어가있지 않을까 생각해보았는데, 직접 build에 사용할 api key를 등록해주어야 한다는 것을 알게 되었다. (참고)

 

빌드할때 필요한 환경변수를 github actions에 넣는 방법

방법은 다음과 같다.

1. 일단은 github repository setting에  secret이 등록되어 있어야 한다.

2. 그리고 yaml파일에서 secret을 .env파일에 등록해줘야 한다.

// preview.yaml

- name: access to secrets
        run: |
          echo "NEXT_DATOCMS_API_TOKEN=$NEXT_DATOCMS_API_TOKEN" >> .env
        env:
          NEXT_DATOCMS_API_TOKEN: ${{secrets.NEXT_DATOCMS_API_TOKEN}}

 

여기서 >>와 > 도 중요한데,

 

>는 동일한 파일이 있다면 덮어쓰는 것이고

>> 는 동일한 파일이 있을때 그 파일에 새로운 내용을 추가하는 것이다.

 

여러 환경변수를 사용하는 상황을 생각하여 >> 를 이용하였다.

 

3. 그 후 build를 하니 build가 잘 되었다.

name: Vercel Preview Deployment
env:
  VERCEL_ORG_ID: ${{ secrets.VERCEL_ORG_ID }}
  VERCEL_PROJECT_ID: ${{ secrets.VERCEL_PROJECT_ID }}
on:
  push:
    branches-ignore:
      - main
jobs:
  Deploy-Preview:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2
      - name: Install Vercel CLI
        run: npm install --global vercel@latest
      - name: Install pnpm
        run: npm install -g pnpm
      - name: Pull Vercel Environment Information
        run: vercel pull --yes --environment=preview --token=${{ secrets.VERCEL_TOKEN }}
      # Install Dependencies
      - name: Install Dependencies
        run: pnpm install
      # Register environment variables
      - name: access to secrets
        run: |
          echo "NEXT_DATOCMS_API_TOKEN=$NEXT_DATOCMS_API_TOKEN" >> .env
        env:
          NEXT_DATOCMS_API_TOKEN: ${{secrets.NEXT_DATOCMS_API_TOKEN}}
      # Run build
      - name: Build Library
        run: pnpm run build
      - name: Build Project Artifacts
        run: vercel build --token=${{ secrets.VERCEL_TOKEN }}
      - name: Deploy Project Artifacts to Vercel
        run: vercel deploy --prebuilt --token=${{ secrets.VERCEL_TOKEN }}