Docker、NodeJs、Vuejs：无法使用本地主机访问

如何解决Docker、NodeJs、Vuejs：无法使用本地主机访问

我尝试使用 docker 运行我的本地 vue 应用程序，但似乎我无法使用本地主机访问它，我读到这是一个 Windows 问题，但我无法解决它。我是主机问题和 docker 的新手，我没有成功应用该解决方案。

当我跑步时

docker-compose up

一切似乎都很好，我的后端正确连接到我的数据库，我的 vue 应用程序正在运行，但是当尝试在本地访问它时，我遇到了 404 错误。

我的结构项目：

Projet
- backend
-- DockerFile
- frontend
-- DockerFile

docker-compose

后端 DockerFile

FROM node:14.17
workdir /app
copY package.json /app
RUN npm install
copY . /app
EXPOSE 3000
CMD ["npm","start"]

前端 DockerFile

FROM node:lts-alpine
RUN npm install -g http-server
workdir /app
copY package*.json ./
RUN npm install
copY . .
RUN npm run build
EXPOSE 8080
CMD [ "http-server","dist" ]

docker-compose.yml

version: '3.8'
services:
  backend:
    build:
      context: ./Backend
      dockerfile: Dockerfile
    ports:
      - 3000:3000
    environment:
      - NODE_ENV=production
    networks:
      - backend_net
    depends_on:
      - MysqLdb
  frontend:
    build:
      context: ./Frontend
      dockerfile: Dockerfile
    expose:
      - "8080"
    ports:
      - "8080:8080"
    volumes:
      - ./:/app
    networks:
      - backend_net
    depends_on:
      - MysqLdb
  MysqLdb:
    image: MysqL:latest
    command: --default-authentication-plugin=MysqL_native_password
    restart: always
    environment:
      - MysqL_DATABASE=p07_social_network
      - MysqL_ROOT_PASSWORD=secret
    ports:
      - 3306:3306
    expose:
      - 3306
    networks:
      - backend_net
networks:
  backend_net:
    name: p07_network

我的网络检查

[
    {
        "Name": "p07_network","Id": "1114316946c08de4b3e7b966517e1bcb8e6cfe4d56d0bbad9dce5b67d1dddbf1","Created": "2021-05-31T19:29:59.8465635Z","Scope": "local","Driver": "bridge","EnableIPv6": false,"IPAM": {
            "Driver": "default","Options": null,"Config": [
                {
                    "subnet": "172.28.0.0/16","Gateway": "172.28.0.1"
                }
            ]
        },"Internal": false,"Attachable": true,"Ingress": false,"ConfigFrom": {
            "Network": ""
        },"ConfigOnly": false,"Containers": {
            "2f1a7dc4151d13a374d10fd810b0155e07d1694837e57a6aacba8b97e06336a4": {
                "Name": "leonfrederic_7_07032021_MysqLdb_1","EndpointID": "d8480cf00d627de83f1524bb1433d4f6be262c5b9848a38ff7da85e4cefdb0df","MacAddress": "02:42:ac:1c:00:02","IPv4Address": "172.28.0.2/16","IPv6Address": ""
            },"5a5f54be579538982bdbf35b1c5be60465a080bb8c8abc5584e27c64968b5dd7": {
                "Name": "leonfrederic_7_07032021_backend_1","EndpointID": "43385ee40f09c497b1aaf54c691493a3d25efcb9ecfb6f08a3e08e34a6870e71","MacAddress": "02:42:ac:1c:00:03","IPv4Address": "172.28.0.3/16","e55cf7bd076f8e34901a039f5159450856b25d2186c1137d052438ded27329d3": {
                "Name": "leonfrederic_7_07032021_frontend_1","EndpointID": "2712002e92f69b916dfd298ffa85cadbb9d785e35473d9825e7d65df5db84546","MacAddress": "02:42:ac:1c:00:04","IPv4Address": "172.28.0.4/16","IPv6Address": ""
            }
        },"Options": {},"Labels": {
            "com.docker.compose.network": "p07_network","com.docker.compose.project": "leonfrederic_7_07032021","com.docker.compose.version": "1.29.1"
        }
    }
]

编辑：我安装了一个虚拟 linux 并且我有同样的问题。所以我迷路了^^

解决方法

我有同样的问题。您需要将服务器从 localhost 发布到 Dockerfile 中的 0.0.0.0。

前端

FROM mhart/alpine-node:14.16.1
WORKDIR /app
ADD . /app/


RUN rm yarn.lock
RUN yarn
RUN yarn build

ENV HOST 0.0.0.0
EXPOSE 8080

CMD [ "yarn","start" ]

然后你可以去 localhost:8080/ 查看网页浏览器的结果。