不使用 Charles + SSL 隧道，React Native 应用程序无法访问 Android 上的后端 API答案

【问题标题】：React Native app cannot reach backend API on Android, without using Charles + SSL tunnelling不使用 Charles + SSL 隧道，React Native 应用程序无法访问 Android 上的后端 API
【发布时间】：2021-08-13 14:57:45
【问题描述】：

我的 RN 应用在 iOS 上完美运行。但在 Android 上，它无法到达后端（使用 https 托管在云中）或任何其他 URL，如 https://randomuser.me/api

但是当我让设备使用 Charles 作为 HTTP 代理时，安装 Charles 根证书并为后端主机名（或 randomuser.org）启用 SSL 代理 - 它可以正常工作。

问题在 2 台物理 android 9 设备和 Android 11 模拟器上都存在。

我相信我需要更改应用代码中的某种配置，以便让应用调用我的后端 - 它以前可以工作，但现在在升级包括 Android Studio 在内的所有内容后就不行了。或者设备可能被搞砸了？

不幸的是，来自 Apisauce 的错误并没有给我太多提示。我也尝试过原始提取，并在不通过 Charles SSL 代理时收到此错误。

我从fetch 得到的唯一信息是 Fetch ERROR [TypeError: Network request failed]

有什么问题？

【问题讨论】：

标签： android react-native httpbackend apisauce

【解决方案1】：

在app/src/main/res/xml文件夹中创建network_security_config.xml文件（如果没有xml文件夹就新建一个）并添加这个

<?xml version="1.0" encoding="utf-8"?>
<network-security-config>
    <base-config cleartextTrafficPermitted="true">
        <trust-anchors>
            <certificates src="system" />
        </trust-anchors>
    </base-config>
</network-security-config>

在 AndroidManifest.xml 中添加这两行

<application
    ...
    android:usesCleartextTraffic="true"
    android:networkSecurityConfig="@xml/network_security_config"
    ...
>

重新安装应用

【讨论】：

谢谢！问题是由我实现 Charles 代理支持引起的，我忘了在 user 旁边列出系统 certificates...