NextJS本地构建正常但Docker构建失败：连接被拒绝错误

核心问题 #

两个NextJS应用仅Docker端口（3000/3003）不同，第一个本地+Docker构建正常，第二个构建时/flash-sales/[slug]页面的Axios请求localhost:80触发ECONNREFUSED，常规调整（端口、Node版本、缓存）无效。

可能原因及解决办法 #

1. 构建阶段的网络隔离问题 #

Docker构建容器内的localhost并非宿主机的localhost，构建阶段请求localhost:80实际指向容器内部，而容器内未运行对应服务。

• 解决：
  • 用宿主机实际IP替换localhost（比如http://192.168.x.x:80），或者在next.config.js中通过环境变量区分构建/运行环境的API地址：

    module.exports = {
      env: {
        API_BASE_URL: process.env.BUILD_ENV === 'docker' ? 'http://宿主机IP:80' : 'http://localhost:80'
      }
    }
    

  • 构建Docker时传递环境变量：docker build --build-arg BUILD_ENV=docker -t your-app .

2. 静态生成（getStaticProps）的时机冲突 #

如果/flash-sales/[slug]使用getStaticProps做静态生成，构建阶段会执行数据请求，此时后端服务可能未被容器访问到。

• 解决：
  • 改用getServerSideProps，将数据请求延迟到应用运行时执行（避免构建阶段依赖外部服务）；
  • 采用Docker多阶段构建，先启动后端服务，再执行NextJS构建（需确保后端服务在构建网络内可访问）。

3. Docker网络配置差异 #

第二个应用的Docker构建网络与第一个不同，导致无法访问外部服务。

• 解决：
  • 构建时添加--network="host"参数，让容器共享宿主机网络（仅适合开发/测试场景）：

    docker build --network=host -t your-app .
    

  • 若后端也用Docker部署，将两者加入同一自定义网络，用服务名代替localhost访问（比如http://backend-service:80）。

4. 后端服务状态异常 #

构建第二个应用时，宿主机的80端口可能被占用，或后端服务未正常启动。

• 解决：
  • 构建前用netstat -tulpn | grep :80确认端口状态；
  • 在Dockerfile中加入服务就绪检测脚本（如wait-for-it.sh），确保后端可用后再执行构建：

    COPY wait-for-it.sh /wait-for-it.sh
    RUN chmod +x /wait-for-it.sh
    RUN /wait-for-it.sh http://backend:80 -- npm run build
    

补充排查点 #

请提供以下信息以精准定位：

• 完整的Dockerfile内容
• next.config.js中的API相关配置
• 构建时的环境变量设置

内容的提问来源于stack exchange，提问作者Veselin Yotov