React Native网络请求的详细剖析

2023-12-31 06:39:51

在React Native中，使用Fetch API进行网络请求是一个常见且重要的任务。Fetch API提供了一个全局的fetch()函数，允许您轻松合理地异步获取网络资源。

Fetch API不会因为HTTP错误状态码而不返回Promise，即使状态码为404/500等，它也会正常解析请求（将ok状态置为否）。只有在网络错误（例如无法连接到网络）的情况下，才会抛出错误。

使用Fetch API进行网络请求的步骤如下：

使用fetch()函数发起请求。fetch()函数接受一个请求URL作为参数，并返回一个Promise对象。
处理请求的响应。当请求完成时，Promise对象将被解析，您可以使用then()方法来处理响应。then()方法接受两个参数：一个用于处理成功响应的函数和一个用于处理错误响应的函数。
处理错误。如果请求失败，fetch()函数将抛出错误。您可以使用catch()方法来处理错误。catch()方法接受一个参数：一个用于处理错误的函数。

以下是使用Fetch API进行网络请求的一个示例：

fetch('https://example.com/api/data')
  .then(response => {
    if (response.ok) {
      return response.json();
    }
    throw new Error('Network response was not OK');
  })
  .then(data => {
    console.log(data);
  })
  .catch(error => {
    console.log(error);
  });

在上面的示例中，我们使用fetch()函数发起了一个到https://example.com/api/data的请求。如果请求成功（状态码为200），我们将使用response.json()方法将响应解析为JSON数据，然后将数据输出到控制台。如果请求失败，我们将使用catch()方法来处理错误，并将错误信息输出到控制台。

Fetch API提供了许多选项来配置请求。 以下是一些常用的选项：