讓伺服器端執行期可存取環境變數

Amplify Hosting 支援透過在 Amplify 主控台的專案組態中設定環境變數，將環境變數新增至應用程式的建置。不過，Next.js 伺服器元件預設無法存取這些環境變數。此行為旨在保護儲存在應用程式在建置階段期間使用的環境變數中的任何秘密。

若要讓 Next.js 可存取特定環境變數，您可以修改 Amplify 建置規格檔案，以在 Next.js 識別的環境檔案中設定這些變數。這可讓 Amplify 在建置應用程式之前載入這些環境變數。下列建置規格範例示範如何在建置命令區段中新增環境變數。

version: 1
frontend:
  phases:
    preBuild:
      commands:
        - npm ci
    build:
      commands:
        - env | grep -e DB_HOST -e DB_USER -e DB_PASS >> .env.production
        - env | grep -e NEXT_PUBLIC_ >> .env.production
        - npm run build
  artifacts:
    baseDirectory: .next
    files:
      - '**/*'
  cache:
    paths:
      - node_modules/**/*
      - .next/cache/**/*

在此範例中，建置命令區段包含兩個命令，在應用程式建置執行之前將環境變數寫入.env.production檔案。Amplify Hosting 可讓應用程式在接收流量時存取這些變數。

上述範例中建置命令區段的下列行示範如何從建置環境取得特定變數並將其新增至 .env.production 檔案。

- env | grep -e DB_HOST -e DB_USER -e DB_PASS >> .env.production

如果您的建置環境中存在變數，.env.production檔案將包含下列環境變數。

DB_HOST=localhost
DB_USER=myuser
DB_PASS=mypassword

上述範例中建置命令區段的下列行示範如何將具有特定字首的環境變數新增至 .env.production 檔案。在此範例中，NEXT_PUBLIC_會新增具有 字首的所有變數。

- env | grep -e NEXT_PUBLIC_ >> .env.production

如果組建環境中存在多個具有NEXT_PUBLIC_字首的變數，則.env.production檔案看起來會類似以下內容。

NEXT_PUBLIC_ANALYTICS_ID=abcdefghijk
NEXT_PUBLIC_GRAPHQL_ENDPOINT=uowelalsmlsadf
NEXT_PUBLIC_SEARCH_KEY=asdfiojslf
NEXT_PUBLIC_SEARCH_ENDPOINT=https://search-url

SSR monorepos 的環境變數

如果您要在 monorepo 中部署SSR應用程式，並想要讓 Next.js 可存取特定環境變數，則必須在.env.production檔案前面加上應用程式根。下列範例會在 Nx 單複本中為 Next.js 應用程式建置規格，示範如何在建置命令區段中新增環境變數。

version: 1
applications:
  - frontend:
      phases:
        preBuild:
          commands:
            - npm ci
        build:
          commands:
            - env | grep -e DB_HOST -e DB_USER -e DB_PASS >> apps/app/.env.production
            - env | grep -e NEXT_PUBLIC_ >> apps/app/.env.production
            - npx nx build app
      artifacts:
        baseDirectory: dist/apps/app/.next
        files:
          - '**/*'
      cache:
        paths:
          - node_modules/**/*
      buildPath: /
    appRoot: apps/app

上述範例中建置命令區段中的下列行示範如何從建置環境取得特定變數，並將其新增至具有應用程式根 之單一複本中的應用程式.env.production檔案apps/app。

- env | grep -e DB_HOST -e DB_USER -e DB_PASS >> apps/app/.env.production
- env | grep -e NEXT_PUBLIC_ >> apps/app/.env.production