Question

我有一个简单的Dockerfile来创建映像以充当节点应用程序的开发环境。问题是容器和我的机器之间的端口绑定无法按预期工作。

Dockerfile：

FROM node:10.12.0
EXPOSE 8080

从该文件中，我使用以下命令创建图像：

docker build -t node:10.12.0.bern ./images/node/

我使用以下命令启动容器：

docker run --rm --name=run-client \
    -v $(CURDIR)/client:/app/client:rw \
    -v $(CURDIR)/kawax-js:/app/kawax-js:rw \
    -v $(CURDIR)/enigma:/app/enigma:rw \
    -v $(CURDIR)/client-init/init-client.sh:/usr/local/bin/init-client.sh:rw \
    -p 8080:8080 \
    node:10.12.0.bern \
    /bin/sh -c "sh /usr/local/bin/init-client.sh"

这是我的脚本init-client.sh：

#!/usr/bin/env bash

cd /app/enigma/
npm link

cd /app/kawax-js/
npm link

cd /app/client/
npm link enigma
npm link kawax-js

npm run dev

最后在package.json文件中运行我的开发脚本：

  "scripts": {
    "dev": "npm run dev:server & npm run sass:watch & npm run lint:watch",
    "build": "npm run client:build && npm run sass:build",
    "dev:server": "webpack-dev-server --mode development --hot",
    "dev:watchOnly": "webpack --progress --watch -d",
    "client:build": "webpack --mode production",
    "client:minify": "NODE_ENV=production npm run client:build",
    "client:analyze": "___WEBPACK_ANALYZE__=true webpack",
    "sass:build": "node-sass --source-map true --include-path scss scss/app.scss dist/css/bernstein.css",
    "sass:watch": "npm run sass:build & nodemon -e scss -x 'npm run sass:build'",
    "lint": "eslint src/**",
    "lint:changed": "git status | grep .js\\$ | awk '{print $NF}' | xargs eslint ",
    "lint:watch": "nodemon -e js -x 'npm run lint -- --fix'",
    "test": "jest --verbose",
    "test:watch": "jest --verbose --debug --watchAll",
    "deploy:staging": "./scripts/deploy.staging.sh",
    "deploy:production": "./scripts/deploy.production.sh"
  },

在我的机器或容器上运行此脚本将在端口8080处启动webpack服务器。从我的机器或docker容器（服务器的日志）中启动服务器完全没有问题：

Rendering Complete, saving .css file...
Wrote Source Map to /app/client/dist/css/bernstein.css.map
Wrote CSS to /app/client/dist/css/bernstein.css
[nodemon] clean exit - waiting for changes before restart
clean-webpack-plugin: /app/client/dist/js has been removed.
ℹ ｢wds｣: Project is running at http://localhost:8080/
ℹ ｢wds｣: webpack output is served from /assets
ℹ ｢wds｣: Content not from webpack is served from /app/client/public
ℹ ｢wds｣: 404s will fallback to /index.html

如果查看装入的卷，我可以看到所有捆绑操作均正确完成。运行docker ps我得到：

CONTAINER ID        IMAGE               COMMAND                  CREATED             STATUS              PORTS                      NAMES
db2c5d45c9a6        node:10.12.0.bern        "sh /usr/local/bin/i…"   2 minutes ago       Up 2 minutes        0.0.0.0:8080->8080/tcp   run-client

问题是，当我在浏览器上转到0.0.0.0:8080时，什么也看不到。我不明白，尽管服务器已启动并在容器中正常运行，但为什么端口绑定无法正常工作？

Answer 1

当心webpack-dev-server！默认情况下，它绑定到localhost。

将其更改为：

"dev:server": "webpack-dev-server --mode development --hot --host 0.0.0.0"

您需要更新webpack-dev-server（在package.json命令和webpack.config.json中）配置，以将主机绑定到0.0.0.0而不是localhost（默认值！）。 localhost只是操作系统中的alias，在容器中不可用。

https://webpack.js.org/configuration/dev-server/#devserver-host

Answer 2

重要更改 替换Project is running at http://localhost:8080/

应在http://0.0.0.0:8080/上运行

在您的应用中。

使用netstate -tulpn。或ss -tln在主机上，找到端口8080，并确保将其绑定到0.0.0.0或主机的ip。

此外，如果仅绑定到本地主机，则在浏览器中以如下方式访问它：

http://127.0.0.1:8080

如果绑定到主机ip或0.0.0.0，则为此

http://host-ip:8080

还请确保您可以使用127.0.0.1或localhost和主机IP在容器内和主机上将其卷曲在8080上

使用webpack-dev-server启动时，Docker容器未按预期发布端口

2 个答案: