Mac上Laravel+Vagrant端口转发无法访问localhost:5173问题

问题背景 #

我能通过http://homestead.test访问Vagrant内的Web服务器，为了访问Vite编译的静态文件，在Homestead.yaml中添加了端口转发规则：

ports:
    - send: 33060 # MySQL/MariaDB
      to: 3306
    - send: 5173
      to: 5173

但配置后仍无法访问http://127.0.0.1:5173，不过Mac能通过33060端口连接MySQL，说明端口转发功能本身正常。执行iptables -L得到如下输出：

Chain INPUT (policy ACCEPT)
target     prot opt source               destination

Chain FORWARD (policy DROP)
target     prot opt source               destination
DOCKER-USER  all  --  anywhere             anywhere
DOCKER-ISOLATION-STAGE-1  all  --  anywhere             anywhere
ACCEPT     all  --  anywhere             anywhere             ctstate RELATED,ESTABLISHED
DOCKER     all  --  anywhere             anywhere
ACCEPT     all  --  anywhere             anywhere
ACCEPT     all  --  anywhere             anywhere

Chain OUTPUT (policy ACCEPT)
target     prot opt source               destination

Chain DOCKER (1 references)
target     prot opt source               destination

Chain DOCKER-ISOLATION-STAGE-1 (1 references)
target     prot opt source               destination
DOCKER-ISOLATION-STAGE-2  all  --  anywhere             anywhere
RETURN     all  --  anywhere             anywhere

Chain DOCKER-ISOLATION-STAGE-2 (1 references)
target     prot opt source               destination
DROP       all  --  anywhere             anywhere
RETURN     all  --  anywhere             anywhere

Chain DOCKER-USER (1 references)
target     prot opt source               destination
RETURN     all  --  anywhere             anywhere

排查方案 #

1. 检查Vite服务绑定地址 #

Vite默认开发模式下仅绑定127.0.0.1，导致服务只能在虚拟机内部访问，宿主机无法通过端口转发连接。

• 修改Vite配置文件（vite.config.js/vite.config.ts）：

export default defineConfig({
  server: {
    host: '0.0.0.0', // 允许外部访问
    port: 5173
  }
})

• 重启Vite服务后重新测试。

2. 重新加载Homestead配置 #

修改Homestead.yaml后，仅重启虚拟机可能无法生效，需执行：

vagrant reload --provision

该命令会重新加载配置并执行provision脚本，确保端口转发规则被正确应用。

3. 检查防火墙拦截情况 #

虽然iptables INPUT策略为ACCEPT，但仍需排查：

• 虚拟机内部：检查ufw防火墙状态

sudo ufw status

若开启且未允许5173端口，执行：

sudo ufw allow 5173/tcp

• 宿主机Mac：打开「系统设置」-「网络」-「防火墙」，确认无拦截5173端口的规则。

4. 显式指定端口转发协议 #

在Homestead.yaml中显式指定TCP协议，避免默认规则异常：

ports:
    - send: 33060 # MySQL/MariaDB
      to: 3306
      protocol: tcp
    - send: 5173
      to: 5173
      protocol: tcp

修改后执行vagrant reload --provision生效。

5. 确认Vite服务端口状态 #

在虚拟机内执行命令，确认Vite是否真的绑定了5173端口：

netstat -tulpn | grep 5173
# 或使用ss命令
ss -tulpn | grep 5173

若无输出，说明Vite服务未启动或端口配置错误，先确保服务正常运行。

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