Create-React-App启动后网络URL随机失效，同网设备为何无法访问？

1. 局域网URL间歇性不展示的触发逻辑 #

• Create React App的开发服务器启动时，会通过系统接口枚举本机所有网卡的IPv4地址用于生成局域网访问链接。当设备同时存在多块虚拟/物理网卡（例如Docker虚拟网桥、VMware/VirtualBox虚拟网卡、VPN拨号网卡、同时连接Wi-Fi与有线网络）时，枚举结果不稳定，会出现有时识别到有效局域网地址、有时仅获取到环回地址127.0.0.1的情况，最终表现为局域网URL时有时无。
• 系统防火墙、安全软件会拦截开发服务器对系统网卡信息的查询请求，导致CRA无法获取非环回段的地址，仅输出本地访问链接，不展示局域网地址。
• 每次网络连接状态变更（例如Wi-Fi重连后路由器重新分配IP、临时开启热点共享、切换全局网络代理），都会导致CRA启动时抓取的地址与当前实际局域网网段不匹配，无法生成有效局域网访问URL。

2. 局域网URL正常展示但其他设备访问挂起的常见诱因 #

• 系统防火墙入站规则拦截：CRA开发服务器默认使用3000端口，系统默认会丢弃来自非本机的入站连接。即便之前防火墙弹窗时选择了允许访问，一旦Node.js版本、程序启动路径、服务端口发生变化，旧的入站规则就会失效，新的拦截不会弹出提示，直接丢弃所有跨设备的访问请求，表现为页面一直挂起无响应。
• 路由器开启 AP隔离（客户端隔离） 功能：即便两台设备连接同一Wi-Fi的2.4G/5G频段，路由器会禁止所有同网终端之间的互相通信，这种情况下即便输入正确的IP与端口，也无法建立有效连接，与CRA本身的配置无关。
• 服务绑定地址异常：CRA默认可能仅绑定环回地址127.0.0.1，即便启动界面错误展示了局域网URL，实际开发服务并没有监听对应局域网网卡的地址，外部请求自然无法收到响应。
• 局域网IP地址冲突：本机获取的局域网IP与网络下其他设备重复，其他设备发起访问请求时，路由器会将流量转发到错误的主机，导致连接一直挂起。

• 启动开发服务时手动指定全局监听地址，执行命令：HOST=0.0.0.0 npm start，该配置会让开发服务器直接绑定所有可用网卡地址，无论网卡枚举结果如何，外部请求都能被服务正常接收，从根源上解决服务未绑定局域网网卡的问题。
• 手动检查系统防火墙入站规则，为Node.js程序开放3000端口的全来源入站权限；临时验证阶段可暂时关闭系统防火墙，确认是否为拦截规则导致的访问异常。
• 登录路由器管理后台，关闭AP隔离/客户端隔离功能，确认两台设备获取的IP处于同一子网段（例如均为192.168.x.x段，未被划分到隔离VLAN）。
• 为设备固定静态局域网IP地址，避免路由器动态分配地址导致的访问地址频繁变更，同时减少IP冲突的概率。

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