Dockerized Angular 4和Django编译成功，但localhost：4200不能正常工作
我想用Django后端和postgresql数据库dockerize Angular 4前端。 在这一刻我的文件如下所示。 我记得确定这是否正确完成？ 当我尝试docker-compose up我得到了Angular 4前端和Django后端都成功启动的信息。 不幸的是，当我打开http：// localhost：4200它不起作用（localhost：8001似乎工作）：
Safari can't open the page because the server unexpectedly dropped the connection
我的日志：
django_1 | Django version 1.11, using settings 'project.settings' django_1 | Starting development server at http://0.0.0.0:8001/ django_1 | Quit the server with CONTROL-C. angular_1 | ** NG Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200 ** angular_1 | Time: 20657ms angular_1 | chunk {0} polyfills.bundle.js, polyfills.bundle.js.map (polyfills) 232 kB {4} [initial] [rendered] angular_1 | chunk {1} main.bundle.js, main.bundle.js.map (main) 222 kB {3} [initial] [rendered] angular_1 | chunk {2} styles.bundle.js, styles.bundle.js.map (styles) 11.6 kB {4} [initial] [rendered] angular_1 | chunk {3} vendor.bundle.js, vendor.bundle.js.map (vendor) 4.41 MB [initial] [rendered] angular_1 | chunk {4} inline.bundle.js, inline.bundle.js.map (inline) 0 bytes [entry] [rendered] angular_1 | webpack: Compiled successfully.
我的文件结构：
├── Backend │ ├── AI │ │ ├── __init__.py │ │ ├── __pycache__ │ │ │ ├── __init__.cpython-36.pyc │ │ │ ├── settings.cpython-36.pyc │ │ │ ├── urls.cpython-36.pyc │ │ │ └── wsgi.cpython-36.pyc │ │ ├── settings.py │ │ ├── urls.py │ │ └── wsgi.py │ └── manage.py ├── Dockerfile ├── Frontend │ └── angularProject ├── Dockerfile │ └── all files in my angular project ├── docker-compose.yml └── requirements.txt
来自前端的Dockerfile ：
# Create image based on the official Node 6 image from dockerhub FROM node:6 # Create a directory where our app will be placed RUN mkdir -p /usr/src/app # Change directory so that our commands run inside this new directory WORKDIR /usr/src/app # Copy dependency definitions COPY package.json /usr/src/app # Install dependecies RUN npm install # Get all the code needed to run the app COPY . /usr/src/app # Expose the port the app runs in EXPOSE 4200 # Serve the app CMD ["npm", "start"]
主目录下的Dockerfile ：
FROM python:3.6.1 ENV PYTHONUNBUFFERED 1 RUN mkdir /code WORKDIR /code ADD requirements.txt /code/ RUN pip3 install -r requirements.txt ADD . /code/
docker-compose.yml ：
version: '3' services: db: image: postgres environment: POSTGRES_USER: aso POSTGRES_PASSWORD: somepass django: build: . command: python3 MainDirectory/backend/myProject/manage.py runserver 0.0.0.0:8001 volumes: - .:/code ports: - "8001:8001" depends_on: - db angular: build: MainDirectory/frontend ports: - "4200:4200" depends_on: - django
听力：
CONTAINER ID IMAGE COMMAND CREATED STATUS PORTS NAMES e214d1966286 dockerproj_angular "npm start" 2 hours ago Up 36 seconds 0.0.0.0:4200->4200/tcp dockerpri_angular_1 b9fa457bd119 dockerproj_django "python3 PROJ/backe..." 2 hours ago Up 37 seconds 0.0.0.0:8000->8000/tcp dockerpri_django_1 e36635448b6e postgres "docker-entrypoint..." 2 hours ago Up 37 seconds 5432/tcp dockerpri_db_1 docker exec e214d1966286 ss -ltn State Recv-Q Send-Q Local Address:Port Peer Address:Port LISTEN 0 128 127.0.0.11:42403 *:* LISTEN 0 128 127.0.0.1:4200 *:*
解决方法：我改变了package.json "start": "ng serve"到"start": "ng serve --host 0.0.0.0" 。
这个问题似乎与您的节点应用正在监听的接口有关。
当docker映射一个端口时，它在主机接口和eth0容器接口之间进行，而不是到本地主机接口。
所以，如你所说，改变这一点：
"start": "ng serve"
至：
"start": "ng serve --host 0.0.0.0".
将解决问题。