You need to enable JavaScript to run this app.
最新活动
大模型
产品
解决方案
定价
生态与合作
支持与服务
开发者
了解我们

纯Expo React Native项目真机出现TypeError: Network request failed问题求助

解决纯Expo React Native项目真机上的TypeError: Network request failed问题

我来帮你排查这个棘手的网络请求失败问题——纯Expo项目确实不用碰原生的android/ios文件夹,咱们从几个最常见的方向入手解决:

1. 先确认HTTPS证书的有效性

虽然你用了HTTPS,但如果证书是自签名、过期或域名不匹配,iOS和Android都会直接拦截请求,而且不会有加载过程,直接报错。针对纯Expo项目,你可以这样配置:

iOS端配置(在app.json中)

如果你的API用的是自签名证书,需要在expo.ios.infoPlist里添加NSAppTransportSecurity的例外规则:

{
  "expo": {
    "ios": {
      "infoPlist": {
        "NSAppTransportSecurity": {
          "NSAllowsArbitraryLoads": false,
          "NSExceptionDomains": {
            "你的API域名(比如api.example.com)": {
              "NSIncludesSubdomains": true,
              "NSExceptionAllowsInsecureHTTPLoads": false, // 仅当证书是自签名时设为true
              "NSExceptionRequiresForwardSecrecy": false
            }
          }
        }
      }
    }
  }
}

Android端配置(在app.json中)

同样针对自签名证书,在expo.android.networkSecurityConfig里配置信任你的证书:

  1. 先把证书文件(比如cert.pem)放到项目的assets文件夹
  2. 在app.json中添加配置:
{
  "expo": {
    "android": {
      "networkSecurityConfig": {
        "domainConfigs": {
          "你的API域名": {
            "trustAnchors": [
              {
                "certificates": ["../assets/cert.pem"]
              }
            ]
          }
        }
      },
      "assetBundlePatterns": ["assets/*"]
    }
  }
}

2. 检查网络环境与请求细节

  • 网络权限:确认真机上的Expo Go应用有网络访问权限(在设备的设置里找Expo Go,检查是否允许蜂窝数据/Wi-Fi)
  • 域名可达性:你提到设备用的是US网络,试试在设备的浏览器里直接打开API的URL,看能不能访问——如果浏览器也打不开,说明是网络本身的问题(比如API域名被区域限制、VPN配置冲突)
  • 请求参数:把你的请求URL、headers、请求体用console.log打印出来,确认有没有拼写错误(比如域名多了斜杠、headers里的Content-Type设置错误)

3. 考虑Expo Go的限制

如果你的API用的是自签名证书,Expo Go默认是不接受这类证书的。这时候你可以用expo-dev-client构建自定义的开发客户端:

  1. 安装依赖:npx expo install expo-dev-client
  2. 在app.json中启用dev client:
{
  "expo": {
    "developerClient": true
  }
}
  1. 构建并安装自定义dev客户端到真机:eas build --profile development --platform ios/android
    这样自定义的客户端可以信任你的自签名证书,解决证书导致的拦截问题。

内容的提问来源于stack exchange,提问作者Benjamin Heinke

火山引擎 最新活动