Docker化React应用程序:应用程序在容器内启动,但无法从暴露的端口访问

时间:2018-05-17 21:21:39

标签: node.js reactjs docker docker-compose

这是一个专门针对教程的问题:http://mherman.org/blog/2017/12/07/dockerizing-a-react-app/#.Wv3u23WUthF Michael Herman

问题:应用程序在容器内启动,但无法从我刚刚公开的端口-p 3000:3000访问它。当浏览到localhost:3000获取无法访问此站点时错误

搬运工-compose.yaml

version: '3.5'

services:

  sample-app:
    container_name: sample-app
    build:
      context: .
      dockerfile: Dockerfile
    volumes:
      - '.:/usr/src/app'
      - '/usr/src/app/node_modules'
    ports:
      - '3000:3000'
    environment:
      - NODE_ENV=development

Dockerfile

# base image
FROM node:9.6.1

# set working directory
RUN mkdir /usr/src/app
WORKDIR /usr/src/app

# add `/usr/src/app/node_modules/.bin` to $PATH
ENV PATH /usr/src/app/node_modules/.bin:$PATH

# install and cache app dependencies
COPY package.json /usr/src/app/package.json
RUN npm install --silent
# RUN npm install react-scripts@1.1.1 -g --silent # Uncomment to silent logs
RUN npm install react-scripts@1.1.1 -g 

# start app
CMD ["npm", "start"]

#CMD tail -f /usr/src/app/README.md


###################################
# To Run sample app:
# docker run -it -v ${PWD}:/usr/src/app -v /usr/src/app/node_modules -p 3000:3000 --rm sample-app

Docker日志https://docs.google.com/document/d/14LRCgjMLAkmdMiuedxAW2GWUAtxmWeJQCNQB2ezdYXs/edit

运行compose或单个容器后。它显示了成功的启动,但此后没有任何内容。

当我将docker exec放入容器时,$ curl localhost:3000会返回正确的index.html页面

我使用以下任一方式启动容器:

$ docker run -it -v ${PWD}:/usr/src/app -v /usr/src/app/node_modules -p 3000:3000 --rm sample-app

< - (图片sample-app存在)

$ docker-compose up

3 个答案:

答案 0 :(得分:2)

问题是你在localhost上严格暴露应用程序。 您必须修改package.json才能更改:

"start": "http-server -a localhost -p 3000"

成:

"start": "http-server -a 0.0.0.0 -p 3000"

如果package.json的内容与上述内容有很大不同,则重要的部分是-a选项 - 它必须指向0.0.0.0,因为它意味着http -server将侦听所有传入连接。

如果您不确定要更改什么,只需在问题中发布package.json的重要部分,以便我们检查。

答案 1 :(得分:2)

在消除所有其他因素后,我假设您的应用程序正在侦听localhost。 Localhost的范围限定为容器本身。因此,为了能够连接到它,你必须在容器内。

要解决此问题,您需要让应用程序在0.0.0.0上进行侦听。

答案 2 :(得分:0)

我在使用create-react-app时遇到了同样的问题,但是设法通过不暴露Dockerfile中的docker端口并运行以下命令docker container run -p ANY_PORT_YOU_WANT:**3000** -d image_name来解决了这个问题。碰巧的是,默认情况下,react-server在docker容器中的PORT 3000上运行,并且通过暴露3000以外的任何其他端口,该连接流被终止。默认情况下,启动脚本使用0.0.0.0。参见Issue