WSL环境下Live Server无法通过手机连接的问题求助

核心原因 #

WSL默认采用NAT网络模式，Live Server启动时会绑定WSL内部的私有IP（通常是172.x.x.x段），这个IP在本地局域网中无法被外部设备（比如手机）访问，且端口未自动转发到Windows主机的局域网IP上。而Windows原生环境下Live Server直接绑定主机的局域网IP，因此手机能正常访问。

方法1：修改Live Server配置（推荐） #

通过调整扩展设置，让Live Server绑定所有网卡并允许外部访问：

• 打开VS Code设置（快捷键Ctrl+,），搜索Live Server: Host，将值改为0.0.0.0
• 搜索Live Server: Allow Remote Access，勾选启用该选项
• 重启Live Server（点击"Go Live"重新启动）

之后使用Windows主机的局域网IP（而非WSL内部IP）+ 端口5500访问：

• 查看Windows主机局域网IP：打开Windows命令提示符，执行ipconfig，找到WiFi适配器下的IPv4地址（通常为192.168.x.x段）
• 手机浏览器输入该IP和端口（如192.168.1.100:5500）即可访问

方法2：手动端口转发（无需修改扩展配置） #

如果不想调整Live Server设置，可手动将WSL端口转发到Windows主机：

1. 在WSL终端中获取内部IP：执行ip addr | grep eth0，提取inet后的IP地址（如172.28.123.45）
2. 以管理员身份打开Windows命令提示符，执行端口转发命令：

   netsh interface portproxy add v4tov4 listenport=5500 listenaddress=0.0.0.0 connectport=5500 connectaddress=你的WSL内部IP
   

3. 配置Windows防火墙允许5500端口入站：
   • 打开Windows Defender防火墙 → 高级设置 → 新建入站规则
   • 选择"端口" → 输入5500 → 允许连接 → 应用到所有网络类型 → 命名并保存

完成后同样使用Windows主机的局域网IP+5500访问即可。

验证步骤 #

1. 先在Windows本地浏览器输入主机IP:5500确认服务正常
2. 再用同一WiFi下的手机浏览器测试访问

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