React Native连接本地localhost请求Express API报网络请求失败

fetch请求中写的http://localhost:5000指向的是运行React Native代码的载体自身，而非你托管Express服务的开发电脑：

• iOS模拟器、安卓模拟器、物理真机的localhost都默认指向设备/模拟器本身，完全无法访问开发电脑上的本地服务
• Postman能正常返回JSON数据，是因为Postman直接运行在开发电脑上，自然能访问本机5000端口的Express服务，和RN的运行环境不存在网络互通性

按你当前的调试场景替换请求地址，同时检查配套配置：

• 调试载体为iOS模拟器
  将请求地址替换为http://127.0.0.1:5000/api/listings，iOS模拟器会自动将该地址映射到开发电脑的回环地址
• 调试载体为安卓模拟器
  将请求地址替换为http://10.0.2.2:5000/api/listings，该地址是安卓模拟器官方约定的宿主机回环映射地址
• 调试载体为物理真机（iOS/安卓）
  1. 将请求地址替换为开发电脑的局域网IPv4地址（你报错日志中出现的192.168.1.34就是当前开发电脑的局域网地址）
  2. 确保真机和开发电脑连接在同一个WiFi局域网下
  3. 修改Express服务的启动配置，将服务绑定到0.0.0.0而非默认的回环地址，否则局域网内设备无法访问服务：

     // 替换原本的 app.listen(5000)
     app.listen(5000, '0.0.0.0', () => {
       console.log('服务已启动，可被局域网内设备访问')
     })
     

• iOS端额外适配
  iOS从9.0开始默认禁止明文HTTP请求，若上述配置完成后仍报网络错误，在Expo项目的app.json中添加允许明文HTTP的配置：

  "ios": {
    "infoPlist": {
      "NSAppTransportSecurity": {
        "NSAllowsArbitraryLoads": true
      }
    }
  }
  

调整后的请求示例（以真机调试场景为例）：

useEffect(() => {
    fetch("http://192.168.1.34:5000/api/listings")
      .then((response) => response.json())
      .then((responseJSON) => {
        console.log(responseJSON);
        setIsLoading(false);
        setListings(responseJSON);
      })
      .catch((error) => console.log(error));
  }, []);

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