Nextjs 应用程序无法加载脚本

Question

我构建了一个在本地完美运行的 Next.js 应用程序。 我将其部署在 AWS 上。

我尝试使用 AWS 上的 ALB 访问它，但在控制台中看到以下错误：

当我在本地运行“yarn run build”然后“yarn run start”时，它工作得很好。

那么为什么会发生这种情况呢？

这是我的 Dockerfile

FROM node:14-alpine

WORKDIR /app

COPY package.json ./

RUN yarn install --immutable --immutable-cache --check-cache

ENV NODE_ENV=production

COPY ./ .

RUN yarn build

CMD ["yarn", "run", "start"]

我的 github 操作：

name: Deploy to AWS Fargate with major version

on:
  push:
    branches:
      - PRODUCTION

env:
  AWS_REGION: eu-west-1
  ECR_REPOSITORY: landing-page
  ECS_SERVICE: landing-page-service
  ECS_CLUSTER: landing-page
  ECS_TASK_DEFINITION: landing-page

  CONTAINER_NAME: landing-page

jobs:
  deploy:
    name: Deploy
    runs-on: ubuntu-latest
    environment: production

    steps:
      - name: Checkout
        uses: actions/checkout@v2

      - name: Configure AWS credentials
        uses: aws-actions/configure-aws-credentials@v1
        with:
          aws-access-key-id: ${{ secrets.AWS_ACCESS_KEY_ID }}
          aws-secret-access-key: ${{ secrets.AWS_SECRET_ACCESS_KEY }}
          aws-region: ${{ env.AWS_REGION }}

      - name: Login to Amazon ECR
        id: login-ecr
        uses: aws-actions/amazon-ecr-login@v1

      - name: Build, tag, and push image to Amazon ECR
        id: build-image
        env:
          ECR_REGISTRY: ${{ steps.login-ecr.outputs.registry }}
          IMAGE_TAG: ${{ github.sha }}
        run: |
          docker build -t $ECR_REGISTRY/$ECR_REPOSITORY:$IMAGE_TAG .
          docker push $ECR_REGISTRY/$ECR_REPOSITORY:$IMAGE_TAG
          echo "::set-output name=image::$ECR_REGISTRY/$ECR_REPOSITORY:$IMAGE_TAG"

      - name: Download task definition
        run: |
          aws ecs describe-task-definition --task-definition ${{ env.ECS_TASK_DEFINITION }} --query taskDefinition > task-definition.json

      - name: Fill in the new image ID in the Amazon ECS task definition
        id: task-def
        uses: aws-actions/amazon-ecs-render-task-definition@v1
        with:
          task-definition: task-definition.json
          container-name: ${{ env.CONTAINER_NAME }}
          image: ${{ steps.build-image.outputs.image }}

      - name: Deploy Amazon ECS task definition with service
        uses: aws-actions/amazon-ecs-deploy-task-definition@v1
        with:
          task-definition: ${{ steps.task-def.outputs.task-definition }}
          service: ${{ env.ECS_SERVICE }}
          cluster: ${{ env.ECS_CLUSTER }}
          wait-for-service-stability: true

顺便说一句，起初我在 .dockerignore 文件中有 .next，所以我认为它可能会导致问题，但我删除了它并出现问题保存下来。

我正在 AWS 上使用 ALB 运行 Fargate - 仅此而已。

可能出了什么问题？

我能够获取该网站：

但这只是它的“初始”。 CSS、图像、js..未完全加载。

Answer 1

我通过为我的网站创建 SSL 证书并使用负载均衡器更新它来“解决”了这个问题。

对我来说就很满足了。