React Native/Expo Go调用本地API遇TypeError: Network request failed

以下是针对你遇到问题的几个排查和解决方向：

1. 替换HTTPS为HTTP发起请求 #

Philips Hue Bridge的HTTPS证书是自签名的，移动端Expo环境默认会拒绝信任这类非权威机构颁发的证书，而Insomnia、浏览器可以手动绕过这个限制。把请求URL中的https改成http：

useEffect(function() {
  fetch("http://192.168.8.100/clip/v2/resource/device", {
    method: "GET",
    headers: {
      "hue-application-key": "<my api key>"
    }
  })
    .then(res => res.json())
    .then(json => console.log("json", json))
    .catch(err => console.error("fetch error", err))
}, [])

2. 配置Expo的网络权限 #

如果是在真机上运行项目，确保App拥有网络访问权限，同时允许非HTTPS请求（仅开发环境适用）：
在app.json或app.config.js中添加/修改配置：

{
  "expo": {
    "ios": {
      "infoPlist": {
        "NSAppTransportSecurity": {
          "NSAllowsArbitraryLoads": true
        }
      }
    },
    "android": {
      "permissions": ["INTERNET"]
    }
  }
}

注意：上线前请移除NSAllowsArbitraryLoads，改用更严格的ATS配置。

3. 验证局域网连通性与API可用性 #

• 再次确认开发设备（192.168.8.102）和Hue Bridge（192.168.8.100）处于同一WiFi网络
• 在开发电脑终端用curl测试API是否正常响应：

curl -H "hue-application-key: <my api key>" http://192.168.8.100/clip/v2/resource/device

如果curl能返回正常数据，说明API本身没问题，问题出在Expo的网络配置上。

4. 临时尝试no-cors模式（仅测试用） #

如果上述方法无效，可以尝试给fetch添加mode: 'no-cors'（但此模式下无法解析响应JSON，仅用于确认请求是否能发送）：

fetch("http://192.168.8.100/clip/v2/resource/device", {
  method: "GET",
  mode: 'no-cors',
  headers: {
    "hue-application-key": "<my api key>"
  }
})

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