如何在局域网访问WSL2中运行的Next.js开发服务器

1. 确认Next.js服务的绑定地址 #

Next.js开发服务器默认仅绑定127.0.0.1，这会导致只有WSL内部和Windows主机通过localhost转发能访问，局域网其他设备或主机用局域网IP访问时无响应。

• 在WSL2终端执行以下命令，查看端口绑定情况：

  ss -tulpn | grep 3000
  

  若输出地址为127.0.0.1:3000，说明服务仅监听回环地址，需修改启动方式。

2. 修改Next.js启动命令，绑定所有网络接口 #

启动服务时指定HOST=0.0.0.0，让服务监听WSL2实例的所有网络接口：

• 直接启动时执行：

  HOST=0.0.0.0 next dev
  

• 若使用package.json脚本，修改scripts字段：

  "scripts": {
    "dev": "HOST=0.0.0.0 next dev"
  }
  

  之后运行npm run dev重启服务。

3. 清理并重新配置端口代理规则 #

之前的代理规则存在冗余，按以下步骤调整：

• 查看现有规则：

  netsh interface portproxy show all
  

• 删除所有3000端口的代理规则：

  netsh interface portproxy delete v4tov4 listenport=3000 listenaddress=0.0.0.0
  netsh interface portproxy delete v4tov4 listenport=3000 listenaddress=192.168.0.50
  netsh interface portproxy delete v4tov4 listenport=3000 listenaddress=127.0.0.1
  

• 获取WSL2的实际内网IP（WSL2重启后IP会变化，需重新获取）：

  hostname -I | awk '{print $1}'
  

  假设得到的IP为172.23.16.100，替换为你实际的WSL2 IP
• 添加正确的代理规则，将Windows主机局域网IP的3000端口转发至WSL2 IP：

  netsh interface portproxy add v4tov4 listenaddress=192.168.0.50 listenport=3000 connectaddress=172.23.16.100 connectport=3000
  

  如需允许所有主机地址访问，可额外添加listenaddress=0.0.0.0的规则。

4. 验证连通性 #

• 再次在WSL2执行ss -tulpn | grep 3000，确认地址为0.0.0.0:3000
• 在局域网设备或Windows主机访问http://192.168.0.50:3000，测试响应情况
• 若仍有问题，在Windows主机执行telnet 172.23.16.100 3000，确认能连接到WSL2的服务端口

5. 额外注意事项 #

• WSL2重启后IP会变更，如需固定IP，可配置WSL2静态网络IP
• 确认Windows防火墙的3000端口入站规则已启用，且应用到正确的网络配置文件（私有/域网络）

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