VPS中Docker容器通信异常（ERR_NAME_NOT_RESOLVED）

问题根源 #

浏览器运行在用户本地环境，不属于Docker自定义网络custom_net，因此无法识别Docker容器名称blindtest-back——只有Docker网络内的容器才能通过容器名互相访问。这就是直接在前端代码中写http://blindtest-back:8000/api/xxx会导致域名解析失败的核心原因。

以下是三种可行的解决方案：

方案一：前端配置API代理（推荐） #

利用前端服务器的代理功能，将前端发起的/api请求转发到后端容器。这样浏览器只需请求前端域名的/api路径，处于Docker网络内的前端服务器会自动转发到blindtest-back:8000，规避浏览器无法解析容器名的问题。

配置示例（以Vite为例） #

在前端项目的vite.config.js中添加代理配置：

export default {
  server: {
    proxy: {
      '/api': {
        target: 'http://blindtest-back:8000',
        changeOrigin: true,
        rewrite: (path) => path.replace(/^\/api/, '')
      }
    }
  }
}

如果是Create React App，修改package.json：

"proxy": "http://blindtest-back:8000"

修改前端代码中的API请求路径为/api/xxx，不再写完整的容器地址。

方案二：后端开启CORS并通过VPS域名/IP访问 #

直接让前端请求VPS的公网域名或IP加后端端口（http://your-ovh-domain.com:8000/api/xxx），但需要后端配置CORS允许前端域名的跨域请求。

后端CORS配置示例（以Python Flask为例） #

from flask import Flask
from flask_cors import CORS

app = Flask(__name__)
# 允许前端域名的跨域请求
CORS(app, resources={r"/api/*": {"origins": "http://your-ovh-domain.com"}})

@app.route('/api/xxx')
def api_xxx():
    return {"data": "test"}

if __name__ == '__main__':
    # 确保后端监听0.0.0.0，否则容器外无法访问
    app.run(host='0.0.0.0', port=8000)

这种方式需要保持后端容器的8000:8000端口映射，缺点是后端端口暴露在公网，安全性稍差。

方案三：用Nginx做反向代理（生产环境最优） #

新增一个Nginx容器作为统一入口，将所有请求转发到前端或后端容器，无需暴露后端端口到公网，同时解决跨域和域名解析问题。

修改Docker Compose配置 #

version: '3'
services:
  blindtest-front:
    build:
      context: blindtest-front
    container_name: blindtest-front
    networks:
      - custom_net

  blindtest-back:
    build:
      context: blindtest-back
    container_name: blindtest-back
    networks:
      - custom_net

  nginx-proxy:
    image: nginx:alpine
    container_name: nginx-proxy
    ports:
      - "80:80"
    volumes:
      - ./nginx.conf:/etc/nginx/nginx.conf
    networks:
      - custom_net
    depends_on:
      - blindtest-front
      - blindtest-back

networks:
  custom_net:
    name: custom_net
    driver: bridge

创建Nginx配置文件nginx.conf #

events {}

http {
  server {
    listen 80;
    server_name your-ovh-domain.com;

    # 前端页面请求转发到前端容器
    location / {
      proxy_pass http://blindtest-front;
      proxy_set_header Host $host;
      proxy_set_header X-Real-IP $remote_addr;
    }

    # API请求转发到后端容器
    location /api {
      proxy_pass http://blindtest-back:8000;
      proxy_set_header Host $host;
      proxy_set_header X-Real-IP $remote_addr;
    }
  }
}

修改前端代码中的API请求路径为/api/xxx，浏览器访问http://your-ovh-domain.com即可正常使用。

额外注意事项 #

• 检查后端服务是否监听0.0.0.0：如果后端只监听127.0.0.1，即使在Docker网络内也无法访问，必须设置为0.0.0.0。
• 前端容器内curl失败：可尝试直接访问后端容器IP172.18.0.3:8000/api/xxx，如果还是失败，排查后端服务是否正常启动、端口是否正确。

内容的提问来源于stack exchange，提问作者Jules Civel