React Native登录功能fetch请求报Network request failed错误求助

核心根因 #

当前代码中请求地址为http://127.0.0.1:8000/login/，安卓实体机上的127.0.0.1指向设备自身的本地回路，而非运行后端服务的电脑地址，因此无法连通。Postman能正常请求是因为运行在电脑侧，访问的是电脑本地的后端服务。

修复步骤 #

• 确保安卓实体机和运行后端的电脑接入同一局域网
• 查看电脑的局域网IP：Windows系统执行ipconfig，Mac/Linux系统执行ifconfig/ip addr，获取192.168.x.x/10.x.x.x格式的私网IP
• 将代码中的请求地址替换为http://[电脑局域网IP]:8000/login/即可

其他可排查项 #

• 确认电脑防火墙未拦截8000端口的入站请求，可临时关闭防火墙测试
• 确认后端服务监听地址为0.0.0.0而非127.0.0.1，否则仅支持本地访问
• 若后续使用安卓模拟器，可直接用固定保留IP10.0.2.2指向电脑本地

代码优化建议 #

当前代码混用async/await和Promise.then写法，错误处理存在遗漏，可调整为如下统一异步写法：

const loginHandle = async (email, password) => {
  try {
    const response = await fetch('http://替换为你的局域网IP:8000/login/', {
      method: 'POST',
      headers: {
        'Accept': 'application/json',
        'Content-Type': 'application/json'
      },
      body: JSON.stringify({ email, password })
    })
    if (response.ok) {
      const data = await response.json()
      signIn(data.email, data.tokens)
      console.log("response :", data)
      return data
    }
    throw new Error(`请求异常，状态码：${response.status}`)
  } catch (error) {
    console.error(error)
    return { name: "network error", description: error.message || "" }
  }
}

内容的提问来源于stack exchange，提问作者Chen Triều