通过 Fetch 反应本机 Post 请求会抛出网络请求失败

Question

我遇到了以下错误。 目前我使用 React Native 开发 Android 应用程序，因此我计划使用 fetch 为我执行发布请求。

fetch("https://XXreachable-domainXX.de/api/test", {
    method: "post",

    body: JSON.stringify({
      param: 'param',
      param1: 'param',

    })
  })
  .then((response) = > response.json())
  .then((responseData) = > {
    ToastAndroid.show(
      "Response Body -> " + JSON.stringify(responseData.message), ToastAndroid.SHORT
    )
  })
  .catch((error) = > {
    console.warn(error);
  });

应用程序现在抛出错误：

类型错误：网络请求失败

当我将代码更改为 GET-Request 时，它工作正常，在浏览器中以 window.alert() 作为返回，这很酷，而且 Chrome 扩展 Postman 也能正确返回数据。

Answer 1

在设备上使用 Windows 操作系统/PHP 内置服务器/react-native Android 进行开发：

• 检查服务器本地IP地址（

  ipconfig

  ），例如172.16.0.10
• 在react-native中

  fetch

  使用此URL和正确的端口（

  fetch('http://172.16.0.10:8000/api/foo)

  ）
• 使用此特定 IP 而不是本地主机运行 PHP 内置服务器：

  php -S 172.16.0.10:8000 ...

• 关闭专用网络的 Windows 防火墙

这解决了我的 Android 手机和本地服务器之间的连接问题。

Answer 2

这个React Native的错误是相当无用的，所以你需要先获取实际的底层错误。最直接的方法是编写一个小型本机程序，仅使用

HttpsURLConnection

执行相同的查询。

对我来说，实际的错误是

java.security.cert.CertPathValidatorException: Trust anchor for certification path not found.

它有一个众所周知的解决方案：https://developer.android.com/training/articles/security-ssl.html#MissingCa

鉴于浏览器和 Postman 对请求没有问题，这也很可能是您的情况。要检查它，请运行

openssl s_client -connect XXreachable-domainXX.de:443 -showcerts

。如果有证书错误，请先修复它们，这样可以节省您编写本机程序的时间。

编辑：实际上，查看 React Native 的所有底层 Android 错误的最简单方法就是在终端中运行“adb logcat”

Answer 3

其他答案都没有帮助我。 问题是

headers

:

旧标题：

fetch(API_HOST, {
                method: 'POST',
                headers: {
                    Accept: 'application/json'
                },
                body: JSON.stringify(data),

更新标题：

fetch(config.API_HOST, {
                method: 'POST',
                headers: {
                    Accept: 'application/json',
                    'Content-Type': 'application/json'  // I added this line
                },
                body: JSON.stringify(data),

Answer 4

如果您遇到此错误，并且确定一切正常且您正在运行模拟器，只需关闭模拟器并再次启动即可。

现在应该可以运行了。

这通常发生在您的系统休眠一段时间后

Answer 5

步骤1> 在 AndroidManifest.xml 中添加 android:usesCleartextTraffic="true" 行，例如：

// 添加这一行 ... 步骤2> 从您的 android 文件夹中删除所有调试文件夹..

Answer 6

我在使用 fetch 时遇到了同样的问题，这是一个类型错误。所以尝试使用 Axios。这对我有用。

不起作用的代码：

error:[typeError : network Request failed]

return fetch(addProduceApi, { method: 'PATCH', body: bodyParamData, headers: getAuthHeader() })
.then((response: any) => response.json()) .catch((error: any) => console.log('Error in patchProduce: ', error));

工作代码：

return axios.patch(addProduceApi,produceData,{ headers: getAuthHeader()}) 

.then((response: any) => response.json()) .catch((error: any) => console.log('Error in patchProduce: ', error));?

Answer 7

我在 Android 模拟器上做同样的事情时遇到了一个重大问题。在 iOS 上，批准 info.plist 中的域是必要的。需要明确的是，我正在尝试登录我的 .NET Web 托管 API。

解决方法是确保发布数据已参数化。（我很确定这是一个词）

export const loginUser = ({ userName, password }) => {
const data = `UserName=${userName}&Password=${password}&grant_type=password`
    return (dispatch) => {
        dispatch({ type: LOGIN_USER })

        fetch(URL_LOGIN, {
            method: 'POST',
            headers: {
                'Accept': 'application/json',
                'Content-Type': 'application/json',
            },
            body: data
            // body: {

            //     UserName: userName,
            //     Password: password,
            //     grant_type: 'password'

            // }

        })
            .then((response) => { 
                loginUserSuccess(dispatch, response)
            })
            .catch((response) => {
                loginUserFailed(dispatch, response)
            })
    };
};

Answer 8

如果您在模拟器上遇到此问题，请确保也在设备上进行测试。这很可能不会发生在那里。

只是为了让您知道，如果您能解决这个问题，就没有什么可担心的。

Answer 9

由于证书过期，我在 Android 上遇到了此问题。我收到的错误消息是

com.android.org.bouncycastle.jce.exception.ExtCertPathValidatorException: Could not validate certificate: Certificate expired at Fri Sep 29 16:33:39 EDT 2017 (compared to Fri Dec 08 14:10:58 EST 2017)

。

我可以使用 digicert.com 确认这一点。

不幸的是，我确实必须深入研究 React Native 代码并调试捆绑包中的 XHR 代码

(index.android.bundle)

才能找到错误消息和有问题的 URL，因为它存在于我的一些日志记录代码中，我显然也没有登录到控制台。 :)

我得到了这个 GitHub 问题评论的帮助。

Answer 10

重新启动模拟器后我的问题得到解决

Answer 11

添加此标头对我有用：'Content-Type'：'application/json'

谢谢https://stackoverflow.com/users/5999939/arash-younesi

Answer 12

检查以下两个案例

1. 终点错误
2. 互联网连接：真实设备、虚拟设备

因为第二个原因已经吃了2个小时了。