反应本机代码错误[TypeError：网络请求失败]

Question

我是移动应用程序开发新手。

我有一个简单的 React Native 代码，带有一个登录 SAP Business One 服务层的按钮。

当我按下按钮时，出现一般错误：

[类型错误：网络请求失败]

我用邮递员测试了登录，如果禁用 SSL 检查，它的工作原理。

如何获取有关错误的更多详细信息？

我可以绕过 SSL 来查看问题是否与证书有关吗？

请注意，我们使用的证书是可信的。

我也在使用 Visual Studio 模拟器。

下面你可以看到代码。

提前谢谢您。

import { StatusBar } from "expo-status-bar";
import { Button, StyleSheet, Text, View } from "react-native";

export default function App() {
  const login = async () => {
    const myHeaders = new Headers();
    myHeaders.append("Content-Type", "application/json");
    const raw = JSON.stringify({
      CompanyDB: "YYYY",
      UserName: "PP",
      Password: "1234",
    });

    const requestOptions = {
      method: "POST",
      headers: myHeaders,
      body: raw,
      redirect: "follow",
    };

    try {
      const response = await fetch(
        "https://<hostname>:50000/b1s/v1/Login",
        requestOptions
      );
      const result = await response.text();
      console.log(result);
    } catch (error) {
      console.error(error);
    }
  };

  return (
    <View style={styles.container}>
      <Text>Open up App.js to start working on your app!</Text>
      <Button title="login" onPress={login}></Button>
      <StatusBar style="auto" />
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: "#fff",
    alignItems: "center",
    justifyContent: "center",
  },
});

Answer 1

React Native中的此错误 [TypeError: Network request failed] 通常是由于与网络连接、API 错误配置或代码中 fetch 或 axios 的错误使用相关的问题而发生的。以下是故障排除和修复方法：

1. 检查互联网连接 确保您的设备（或模拟器）具有稳定的互联网连接。有时，当网络不可用或不稳定时，会出现此错误。

2. 处理 CORS 问题（对于 Web API 调用） 如果您使用 API，可能会出现跨源资源共享 (CORS) 问题，尤其是从移动或 Web 应用程序调用 API 时。确保您的后端服务器具有正确的 CORS 设置。您可以尝试暂时允许所有来源的请求来验证问题：

   在此输入图片描述

3. 检查 Fetch 或 Axios 请求 确保您的 fetch 或 axios 请求已正确配置：

   在此输入图片描述

4. 处理 HTTPS 和证书 确保您调用的 API 使用 HTTPS 而不是 HTTP。出于安全原因，React Native 中经常会阻止不安全的 HTTP 请求。如果尚未更新您的 API 端点以使用 HTTPS，您可以将其更新。

在

Budventure Technologies，我们专注于 React Native 开发，并帮助客户解决前端和后端开发中的此类问题。如果您正在寻求专业帮助，请随时与我们联系。凭借在印度和美国的专业知识，我们的团队可确保为您的应用程序提供无缝的移动应用程序开发和网络管理。