Docker 使用 Docker 工具箱组合:Node、Mongo、React。 React 应用程序未显示在所述地址中

Docker Compose with Docker Toolbox: Node, Mongo, React. React app not showing in the said adress

我正尝试通过 docker 容器 运行 Express 服务器和 React 应用程序。 Express 服务器 运行 正确位于给定地址(Kitematic GUI 上的地址)。 但是我无法通过给定的地址打开 React 应用程序,无法访问我的网站。

运行 Windows 10 家 Docker 工具箱。

React 应用程序 docker文件:

FROM node:10
# Set the working directory to /client
WORKDIR /frontend
# copy package.json into the container at /client
COPY package*.json ./
# install dependencies
RUN npm install
# Copy the current directory contents into the container at /client
COPY . .
# Make port 3001 available to the world outside this container
EXPOSE 3001
# Run the app when the container launches
CMD ["npm", "run", "start"]

Node/Express docker文件:

# Use a lighter version of Node as a parent image
FROM node:10
# Set the working directory to /api
WORKDIR /backend
# copy package.json into the container at /api
COPY package*.json ./
# install dependencies
RUN npm install
# Copy the current directory contents into the container at /api
COPY . .
# Make port 3000 available to the world outside this container
EXPOSE 3000
# Run the app when the container launches
CMD ["npm", "start"]

Docker 撰写文件:

version: '3'

services:
    client:
        container_name: hydrahr-client
        build: .\frontend
        restart: always
        environment: 
            - REACT_APP_BASEURL=${REACT_APP_BASEURL}
        expose:
            - ${REACT_PORT}
        ports: 
            - "3001:3001"
        links:
            - api
    api:
        container_name: hydrahr-api
        build: ./backend
        restart: always
        expose: 
            - ${SERVER_PORT}
        environment: [
            'API_HOST=${API_HOST}',
            'MONGO_DB=${MONGO_DB}',
            'JWT_KEY=${JWT_KEY}',
            'JWT_HOURS_DURATION=${JWT_HOURS_DURATION}',
            'IMAP_EMAIL_LISTENER=${IMAP_EMAIL_LISTENER}',
            'IMAP_USER=${IMAP_USER}',
            'IMAP_PASSWORD=${IMAP_PASSWORD}',
            'IMAP_HOST=${IMAP_HOST}',
            'IMAP_PORT=${IMAP_PORT}',
            'IMAP_TLS=${IMAP_TLS}',
            'SMTP_EMAIL=${SMTP_EMAIL}',
            'SMTP_PASSWORD=${SMTP_PASSWORD}',
            'SMTP_HOST=${SMTP_HOST}',
            'SMTP_PORT=${SMTP_PORT}',
            'SMTP_TLS=${SMTP_TLS}',
            'DEFAULT_SYSTEM_PASSWORD=${DEFAULT_SYSTEM_PASSWORD}',
            'DEFAULT_SYSTEM_EMAIL=${DEFAULT_SYSTEM_EMAIL}',
            'DEFAULT_SYSTEM_NAME=${DEFAULT_SYSTEM_NAME}',
            'SERVER_PORT=${SERVER_PORT}'
        ]
        ports: 
            - "3000:3000"
        depends_on:
            - mongo
    mongo:
        image: mongo
        restart: always
        container_name: mongo
        ports:
            - "27017:27017"

运行 docker-compose up -d

更新 1:

在构建该图像后,我能够 运行 使用 docker run -p 3000:3000 hydra-client-test 反应应用程序。

由于 运行 容器 -p 3000:3000 工作,客户端实际上可能正在监听端口 3000。尝试设置:

ports:
  - 3001:3000