WSL环境下Docker中运行的Node.js应用无法通过浏览器访问如何解决

你提供的Dockerfile配置、容器启动命令的端口映射规则均正确，无需调整。

核心诱因（概率最高） #

你的Node.js应用默认监听了容器内部的127.0.0.1地址，该地址仅支持容器内部访问，外部（包括WSL宿主机、Windows系统）均无法请求到。你本地能正常访问的React应用默认会绑定0.0.0.0地址，所以不存在该问题。

逐步排查方案 #

• 第一步：修改Node应用监听配置 #

  找到你的应用服务启动代码/开发工具配置：
  • 若使用Express/Koa等原生Node框架，将监听代码修改为绑定0.0.0.0：

    // 错误写法
    app.listen(4000, '127.0.0.1')
    // 正确写法
    app.listen(4000, '0.0.0.0')
    

  • 若使用Vite、Umi、Webpack Dev Server等开发工具，在配置文件中新增host: '0.0.0.0'配置，或者直接修改package.json中的dev启动脚本：

    {
      "scripts": {
        "dev": "原有启动命令 --host 0.0.0.0"
      }
    }
    

• 第二步：验证容器内端口绑定状态 #

  容器启动后，执行以下命令进入容器内部：

  docker exec -it <你的容器ID> sh
  

  执行ss -tulpn查看端口监听状态，确认4000端口绑定的是0.0.0.0而非127.0.0.1。

• 第三步：验证WSL层连通性 #

  回到WSL终端，执行curl http://localhost:4000，如果能正常拿到响应说明容器侧配置正常。如果此时Windows浏览器还是无法访问，可通过WSL IP测试：
  1. WSL内执行ip addr show eth0，找到inet对应的WSL局域网IP，格式为172.x.x.x
  2. Windows浏览器访问http://<WSL_IP>:4000，如果能正常访问说明是WSL localhost转发异常，可临时关闭Windows防火墙后重试。

• 第四步：排查端口占用 #

  Windows终端执行netstat -ano | findstr :4000，确认没有其他进程占用4000端口，容器启动时无端口冲突报错。

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