首页 > 解决方案 > 在 Android 上的 React-Native 中正确超时 XHR 请求

问题描述

在使用 React-Native 在 Android 设备上执行 xmlHttpRequests 时,我们遇到了处理意外行为的问题。我们遇到过应用程序无法完成 API 调用的行为,即使设备已很好地连接到互联网(浏览器可以正常访问非缓存站点)。为我们的用户解决此问题的唯一方法是完全重启应用程序。

为了了解问题及其严重性,我们将所有 API 调用封装到生产中的计时器函数中,并在请求完成时间超过 30 秒时向 Sentry 发送报告。现在我们每天都会收到数百个此类报告,持续时间有时是几个小时甚至几天。

首先,我们没有使用 whatwg-fetch,而是使用 axios,以便我们可以手动设置每个请求的超时时间,但这最终没有任何帮助。

其次,我们深入了解 React-Native 是如何在 Android 上实际实现超时 XHR 请求的,并发现它在底层使用了 OkHttp3。OkHttp 有一个默认的连接、读取和写入超时值,react-native 允许开发者在这里更改连接超时的值。但是,OkHttp 也有一个设置调用超时的方法(从连接到读取响应正文的所有内容),但它的默认值为 0(无超时),并且 React-Native 不允许用户更改它。更多关于 okhttp 超时的信息

我的问题是这是否会成为我们担心的原因,是否应该将其作为错误报告给 React-Native。让我们假设以下情况:

  1. 应用程序对资源进行 API 调用
  2. okhttp 能够在指定的超时限制内连接到资源(默认 10 秒)
  3. okhttp 能够在超时限制(10 秒)内将请求正文写入服务器
  4. 服务器处理请求,但由于某种原因它无法开始向客户端发送响应。我想这可能有很多原因,例如服务器断开连接,服务器崩溃或服务器只是失去与客户端的连接而客户端没有注意到它。由于这里没有超时,okhttp 将愉快地等待服务器开始响应请求。

我是否在这里遗漏了什么或误解了超时在 okhttp 中的工作方式?有没有比实现开发人员在 android 上执行的 API 调用上设置 callTimeout 的能力更好的解决方案?而且,开发人员不能设置自己的读写超时是不是有点愚蠢?当您想在慢速连接上向任一方向发送大量数据时,这不会导致意外行为吗?10s 相当长,但对于所有用例来说可能不够长。

提前感谢您的帮助!

标签: react-nativexmlhttprequestreact-native-androidokhttp

解决方案


推荐阅读