React Native应用无法访问同一网络下Windows PC的API如何解决？

iOS模拟器处理 #

• 确保Windows防火墙允许5000端口的入站请求：打开Windows Defender防火墙，创建入站规则，允许TCP协议的5000端口被局域网设备访问；也可临时关闭防火墙测试（测试后务必重新开启）。
• 检查Windows API服务的绑定地址：必须绑定到0.0.0.0而非127.0.0.1，否则仅能本机访问。比如Node.js/Express项目中，启动代码需写为：

  app.listen(5000, '0.0.0.0', () => {
    console.log('服务运行在0.0.0.0:5000');
  });
  

Android模拟器处理 #

Android模拟器默认处于独立网络沙箱，直接访问Windows局域网IP会失败，可通过以下方式解决：

• 端口转发：在Mac终端执行命令，将模拟器的5000端口映射到Windows机器的5000端口：

  adb reverse tcp:5000 tcp:5000
  

  之后React Native代码中请求地址改为http://localhost:5000/api/pk/get。
• 使用特殊映射地址：Android Studio模拟器可使用10.0.2.2代替Windows局域网IP，该地址会映射到主机（Mac）的localhost，代码中请求地址改为http://10.0.2.2:5000/api/pk/get。
• 桥接模式：若使用第三方模拟器（如夜神），可将模拟器网络设置为桥接模式，使其获取与Mac同一网段的IP，即可直接访问http://192.168.1.109:5000/api/pk/get。

通用排查与优化 #

• 先在Mac终端执行ping 192.168.1.109，确认两台设备网络连通；若不通，检查是否在同一WiFi下，或Windows是否开启局域网隔离。
• 在Mac浏览器中访问http://192.168.1.109:5000/api/pk/get，验证API服务本身可正常访问。
• 完善fetch代码的错误捕获，便于定位问题：

  fetch("http://192.168.1.109:5000/api/pk/get")
    .then(response => response.json())
    .then(data => console.log(data))
    .catch(error => console.error('请求错误详情:', error));
  

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