docker - 无法访问 Dockerized Vue 的 localhost :8080 on host machine (despite EXPOSE-ing port)

Question

我无法在 localhost:8080 上访问我的 Vue 应用程序在对应用程序进行 Docker 化之后。

我有一个 Dockerfile内容如下:

 # Base the image off of the NodeJS image
 FROM node

 # Set the working directory to be the HOME directory
 WORKDIR /root

 # Install NPM dependencies early in the build process
 COPY ./package.json /root
 COPY ./package-lock.json /root
 RUN npm install

 # Specify what port will be available - necessary for VPC network
 EXPOSE 8080

 # Copy our application files to the image
 COPY ./.browserslistrc /root
 COPY ./.eslintrc.js /root
 COPY ./.env /root
 COPY ./babel.config.js /root
 COPY ./README.md /root
 COPY ./vue.config.js /root
 COPY ./public /root/public
 COPY ./src /root/src

 # Start the container running our Node app
 CMD ["npm", "run", "serve"]

(在 Dockerizing 之前， npm run serve 允许我通过我的网络浏览器访问 Vue 应用程序。)

然后我运行 PS 命令 docker build :

PS C:\Users\User\mealSocial-dev> docker build -t finalvue app
Sending build context to Docker daemon  126.8MB
Step 1/15 : FROM node
 ---> 448d0873ea84

[...]

Step 15/15 : CMD ["npm", "run", "serve", "--port", "\"8080\""]
 ---> Running in c4840f98e5dc
Removing intermediate container c4840f98e5dc
 ---> 904928fa859c
Successfully built 904928fa859c
Successfully tagged finalvue:latest
SECURITY WARNING: You are building a Docker image from Windows against a non-Windows Docker host. All files and directories added to build context will have '-rwxr-xr-x' permissions. It is recommended to double check and reset permissions for sensitive files and directories.

...然后 docker run -p 8080:8080 :

PS C:\Users\User\mealSocial-dev> docker run -p 8080:8080 finalvue

> meal-app@0.1.0 serve /root
> vue-cli-service serve

 INFO  Starting development server...
<s> [webpack.Progress] 0% compiling

[...]

DONE Compiled successfully in 8147ms11:39:59 AM
<s> [webpack.Progress] 100%    
App running at:    
- Local: http://localhost:8080/    
It seems you are running Vue CLI inside a container.    
Access the dev server via http://localhost:<your container's external mapped port>/    
Note that the development build is not optimized.   
To create a production build, run npm run build.

尽管它说 It seems you are running Vue CLI inside a container. Access the dev server via http://localhost:<your container's external mapped port>/ , 我得到 This page isn’t working. localhost didn’t send any data. ERR_EMPTY_RESPONSE :


我是 EXPOSE -ing 中的端口 Dockerfile并添加 -p 8080:8080我运行时标记 docker run .我错过了什么？

Answer 1

从评论部分:

添加 --host 0.0.0.0至 npm run serve
或者

添加 host: 0.0.0.0到配置( ./vue.config.js )