无法通过域名访问Docker化Vue.js应用，仅IP可访问求助

问题概述 #

Docker化的Vue.js应用仅能通过IP地址访问，无法通过绑定的域名正常访问；域名托管在Cloudflare，其他子域名均可正常使用，NPM中已配置的proxy.bcsystems.nz运行正常。已尝试使用Docker内部IP配置反向代理、重新申请SSL证书，问题仍未解决。

相关信息 #

配置截图 #

• NPM配置界面：
  
• Portainer界面：
  

修正后的Docker Compose配置 #

version: "3"

services:
  postgres:
    environment:
      - TZ=Pacific/Auckland
      - POSTGRES_PASSWORD=***
      - POSTGRES_DB=***
    image: postgres:11.17-alpine
    restart: always
    volumes:
      - ./postgres/init:/docker-entrypoint-initdb.d
      - ./postgres/data:/var/lib/postgresql/data

  backend:
    build:
      context: ./backend
    restart: always
    environment:
      - TZ=Pacific/Auckland
    ports:
      - "8345:8080"
    depends_on:
      - postgres
    links:
      - postgres

排查与解决步骤 #

1. 确认Docker网络互通性

   • 检查NPM容器和Vue.js应用容器是否处于同一Docker网络：执行docker inspect <NPM容器名>和docker inspect <Vue容器名>查看网络归属，若不在同一网络，将NPM加入应用所在网络，或在docker-compose.yml中为应用指定与NPM相同的网络。
   • 优先使用Vue容器的名称（如vue-app）作为NPM代理的目标主机，比Docker内部IP更稳定，避免IP变动导致失效。

2. 修正NPM代理配置细节

   • 目标端口需填写Vue.js容器内部的服务端口（通常为80或8080），而非宿主机映射的端口。
   • Cloudflare端调整：将对应域名的DNS记录设为DNS only（灰色云朵），避免Cloudflare代理干扰SSL证书申请；证书申请成功后可再切换回代理模式。
   • 检查NPM的SSL配置，确保“Force SSL”选项已开启，且证书状态显示为有效。

3. 验证Vue.js应用基础配置

   • 修改vue.config.js中的publicPath为'/'（根域名访问场景），避免路径错误导致资源加载失败：

     module.exports = {
       publicPath: '/'
     }
     

   • 查看Vue容器日志：执行docker logs <Vue容器名>，确认应用正常启动且无报错信息。

4. 检查网络与防火墙设置

   • 确认服务器防火墙已放行80、443端口；若服务器在局域网内，需在路由器上配置端口转发，将公网80/443端口映射到服务器的对应端口。
   • 执行curl -v https://你的域名测试，根据返回的错误信息定位是DNS解析、SSL证书还是代理转发环节的问题。

5. 查看NPM日志定位根源

   • 在NPM界面的“Logs”选项卡查看对应代理主机的日志，或进入NPM容器查看/data/logs/proxy-host-<ID>.log文件，根据具体错误提示调整配置。

内容的提问来源于stack exchange，提问作者Kevin wang