如何在WSL2中暴露Vite项目并解决同网络手机连接超时问题
如何在WSL2中暴露Vite项目并解决同网络手机连接超时问题
嘿,我之前也碰到过一模一样的问题!WSL2的网络机制有点特殊,光用--host标签有时候还不足以让同网络的设备连上,咱们一步步来排查解决:
第一步:确认WSL2的端口转发设置
WSL2运行在独立的虚拟网卡上,主机需要把外部请求的端口转发到WSL2的内部IP上。- 先在WSL终端里输入
hostname -I,记下返回的WSL2内部IP(比如172.18.0.2) - 打开Windows的PowerShell(管理员权限),输入
netsh interface portproxy show v4tov4查看现有转发规则 - 如果没有针对5173端口的规则,添加一条:
netsh interface portproxy add v4tov4 listenport=5173 listenaddress=0.0.0.0 connectport=5173 connectaddress=你的WSL2内部IP
(如果之后WSL重启IP变了,需要重新执行这条命令更新转发规则)
- 先在WSL终端里输入
第二步:检查防火墙设置
防火墙很可能是挡住连接的“罪魁祸首”,要同时检查Windows防火墙和WSL内部的防火墙:- Windows端:打开「Windows Defender防火墙」→「高级设置」→「入站规则」,新建规则,允许TCP协议的5173端口通过所有网络类型
- WSL端:如果用了
ufw防火墙,在WSL终端输入sudo ufw allow 5173/tcp开放端口
第三步:正确启动Vite项目
别只写vite --host,改成vite --host 0.0.0.0,这样Vite会监听WSL内的所有网卡,确保外部请求能被接收到。这个命令会让Vite输出可以访问的地址,其中应该包含主机的局域网IP,用这个地址在手机上访问就对了。第四步:确认访问地址和网络环境
确保手机和电脑连的是同一个WiFi/局域网,而且手机访问的是主机的局域网IP(不是WSL2的内部IP),比如你的主机在局域网里的IP是192.168.3.10,那手机就打开http://192.168.3.10:5173
如果还是不行,可以试试这些小技巧:
- 重启WSL:在PowerShell输入
wsl --shutdown,然后重新打开WSL终端再启动项目 - 换个端口试试,比如
vite --host 0.0.0.0 --port 5174,避免端口被占用或者防火墙规则冲突
备注:内容来源于stack exchange,提问作者Milan Živković




