You need to enable JavaScript to run this app.
最新活动
大模型
产品
解决方案
定价
生态与合作
支持与服务
开发者
了解我们

如何在WSL2中暴露Vite项目并解决同网络手机连接超时问题

如何在WSL2中暴露Vite项目并解决同网络手机连接超时问题

嘿,我之前也碰到过一模一样的问题!WSL2的网络机制有点特殊,光用--host标签有时候还不足以让同网络的设备连上,咱们一步步来排查解决:

  • 第一步:确认WSL2的端口转发设置
    WSL2运行在独立的虚拟网卡上,主机需要把外部请求的端口转发到WSL2的内部IP上。

    1. 先在WSL终端里输入hostname -I,记下返回的WSL2内部IP(比如172.18.0.2
    2. 打开Windows的PowerShell(管理员权限),输入netsh interface portproxy show v4tov4查看现有转发规则
    3. 如果没有针对5173端口的规则,添加一条:netsh interface portproxy add v4tov4 listenport=5173 listenaddress=0.0.0.0 connectport=5173 connectaddress=你的WSL2内部IP
      (如果之后WSL重启IP变了,需要重新执行这条命令更新转发规则)
  • 第二步:检查防火墙设置
    防火墙很可能是挡住连接的“罪魁祸首”,要同时检查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ć

火山引擎 最新活动