时间戳

首页 > 解决方案 > Docker 平台上的 elasticbeanstalk：react 应用程序的 502 Bad Gateway

reactjs - Docker 平台上的 elasticbeanstalk：react 应用程序的 502 Bad Gateway

问题描述

我有一个从 Dockerfile.dev 部署的虚拟反应应用程序：

FROM node:alpine AS builder
WORKDIR '/app'
COPY package.json .
RUN npm install
COPY . .
RUN npm run build

FROM nginx
EXPOSE 80
COPY --from=builder /app/build /usr/share/nginx/html

它在使用 TravisCI 推送到 GitHub 后立即部署到 elasticbeanstalk：

sudo: required
services:
  - docker

before_install:
  - docker build -t name/docker-react -f Dockerfile.dev .

script:
  - docker run -e CI=true name/docker-react npm run test

deploy:
  provider: elasticbeanstalk
  region: 'us-east-1'
  app: 'docker'
  env: 'Docker-env'
  bucket_name: 'elasticbeanstalk-us-east-1-709516719664'
  bucket_path: 'docker'
  on:
    branch: main
  access_key_id: $AWS_ACCESS_KEY
  secret_access_key: $AWS_SECRET_KEY

该应用程序已成功部署到 EB，但我一访问它就会显示 502 Bad Gateway（通过单击 AWS EB 中的应用程序链接）。增强的运行状况概览报告： 进程默认不正常 18 小时 (Target.FailedHealthChecks)。

Docker-env EC2 实例正在运行，在允许所有传入连接后，我可以正常连接：在此处输入图像描述

我可以毫无问题地在本地使用 Dockerfile.dev 构建我的应用程序：

docker build -t name/docker-react -f Dockerfile.dev .
 => => naming to docker.io/name/docker-react  

docker run -p 3000:3000 name/docker-react

在此处输入图像描述

标签： reactjsdockeramazon-elastic-beanstalk

解决方案

AWS 很难使用“.”。文件夹名称，更喜欢长格式 ./

尝试将 COPY 指令编辑为 COPY package*.json ./

并尝试删除命名的构建器。默认情况下，阶段没有命名，您可以通过它们的整数来引用它们，第一个 FROM 指令从 0 开始。

您的 Dockerfile 应如下所示：

FROM node:alpine
WORKDIR '/app'
COPY package*.json ./
RUN npm install
COPY . .
RUN npm run build

FROM nginx
EXPOSE 80
COPY --from=0 /app/build /usr/share/nginx/html

你应该有一个 docker-compose.yml，只要确保你在里面有正确的端口映射：示例：

services:
    web-service:
        build:
            context: .
            dockerfile: Dockerfile.dev
        ports:
            - "80:3000" # outside:inside container

最后必须编辑您的 TravisCI 配置。secret_acces_key 有一个“S”

...
    access_key_id: $AWS_ACCESS_KEY
    secret_acces_key: $AWS_SECRET_KEY

推荐阅读