Dockerized nginx和vue+nuxt无法连接到前端服务器111:连接被拒绝

6tdlim6h  于 5个月前  发布在  Nginx
关注(0)|答案(1)|浏览(83)

当试图在浏览器中访问localhost时,我在Docker容器中得到502 bad gateway记录以下错误:

failed (111: Connection refused) while connecting to upstream, client: 172.26.0.1, server: localhost, request: "GET / HTTP/1.1", upstream: "http://172.26.0.5:3000/", host: "localhost"

字符串
下面是nginx.conf文件:

events {
    worker_connections 1024;
}

http {
    include /etc/nginx/mime.types;
    default_type application/octet-stream;

    access_log /var/log/nginx/access.log;

    sendfile on;
    keepalive_timeout 65;

    upstream frontend {
        server frontend:3000;
    }

    upstream api {
        server api:8000;
    }
    server {
        listen 80;
        server_name localhost;

        location / {
            proxy_pass http://frontend;
            proxy_set_header Host $host;
            proxy_set_header X-Real-IP $remote_addr;
        }

        location /api {
            proxy_pass http://api;
            proxy_set_header Host $host;
            proxy_set_header X-Real-IP $remote_addr;
        }
    }

}


下面是docker-compose.yml:

version: '3'
services:
    nginx:
        image: nginx
        ports:
            - "80:80"
        volumes:
            - ./backend/nginx.conf:/etc/nginx/nginx.conf # Mount the Nginx config file
        depends_on:
            - api
            - frontend
    api:
        build:
            context: ./backend
            dockerfile: Dockerfile
        ports:
            - '${APP_PORT:-8000}:80'
        volumes:
            - '.:/var/www/'
        depends_on:
            - mysql
    frontend:
        tty: true
        build:
            context: ./frontend
            dockerfile: Dockerfile
        container_name: frontend
        ports:
            - "3000:3000"
        volumes:
            - ./frontend:/app
        depends_on:
            - api
        stdin_open: true
    mysql:
        image: 'mysql:8.0'
        ports:
            - "3306:3306"
        environment:
            MYSQL_ROOT_PASSWORD: '${DB_PASSWORD}'
            MYSQL_DATABASE: '${DB_DATABASE}'
            MYSQL_PASSWORD: '${DB_PASSWORD}'
        volumes:
            - 'mysql_data:/var/lib/mysql'
    mailhog:
        image: 'mailhog/mailhog:latest'
        ports:
            - "1025:1025"
            - "8025:8025"
volumes:
    mysql_data:
        driver: local

具体步骤:

1.检查ip地址- docker容器检查前端-地址匹配

  • Docker container inspect显示->“IPAddress”:“172.26.0.5“,
  • nginx错误消息说:“http://172.26.0.5:3000/”

1.前端容器在日志中运行,没有任何错误-最后一个日志是它在3000上侦听
1.登录到nginx容器:docker container exec -it nginx sh

  • ping frontend -->成功-没有数据包丢失
  • ping API -->成功-没有数据包丢失
  • 所以nginx.conf肯定没问题,毕竟它成功解析了定义为“前端”和“API”的上游

1.上面的测试意味着它们在同一个网络中,在Docker内部网络和名称解析方面一切都应该很好
在这一点上,Nginx似乎配置正确,能够通过ping与上游通信,但在需要路由请求时无法正确建立与前端的连接。
也许问题根源于CORS的一些nuxt/vue配置?

3z6pesqy

3z6pesqy1#

也许现在解决问题已经太晚了,但是nuxt必须正确配置以接受来自外部网络的连接。否则它会拒绝所有不是来自主机的连接。您可以在docker环境中设置“HOST”变量,或者在nuxt配置中设置:
在docker-compose.yaml中:

environment:
      HOST: 0
      PORT: 3000

字符串
或者在nuxt.config.js中:

server: {
    port: 3000,     
    host: '0.0.0.0' // do not put localhost (only accessible from the host machine)
   }


这个问题的答案帮助了我:Unable to Docker to port forward nuxt based express server to host

相关问题