如何在 react-native 中检查服务器是否可访问答案

【问题标题】：How to check if server is reachable in react-native如何在 react-native 中检查服务器是否可访问
【发布时间】：2017-01-19 08:47:59
【问题描述】：

我想在发出请求之前检查我的应用尝试访问的服务器是否可访问（当互联网可访问时）。

我正在使用 Fetch API，现在我正在使用功能超时，效果很好，但我的问题是有什么方法可以检查服务器是否可以访问。

我尝试使用all-reacheable npm 包并添加了以下代码，但我没有收到任何回调响应。

isReachable([
    'http://aposddasd.com',
    'http://google.com'
], (err, reachable, host) => {
  console.log('Server is' + reachable); //=> false
  console.log('App log' +  host); //=> 'http://aposddasd.com'
});

您能帮我找出实现这一目标的最佳方法吗？

【问题讨论】：

我感觉all-reachable 可能不适用于 React Native，因为它使用 fetch API 的自定义实现作为设备自身 HTTP 层的抽象。您是否有任何理由要在发出请求之前检查主机是否可以访问？ Fetch 和 Promise 使处理 HTTP 错误变得非常容易，并且可能会给您的用户带来更好的体验。
如果我的服务器关闭，Fetch API 需要大约 120 秒才能捕获错误，所以我正在寻找快速的东西，我添加了函数超时但想知道是否有更好的选择,

标签： android react-native fetch

【解决方案1】：

您可以使用Promise.race()，它将返回第一个解决或拒绝的承诺 - 实际上它们非常棒！在此处查看文档：

https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Promise/race

这是一个简单的函数，它在 3ms 后超时 - 它使用 httpbin 来模拟 5s 的延迟：

const isAvailable = () => {
    const timeout = new Promise((resolve, reject) => {
        setTimeout(reject, 300, 'Request timed out');
    });

    const request = fetch('https://httpbin.org/delay/5');

    return Promise
        .race([timeout, request])
        .then(response => alert('It worked :)'))
        .catch(error => alert('It timed out :('));
}

isAvailable();

在这里查看小提琴：https://jsfiddle.net/edcs/8Lcg8a8j/10/

【讨论】：

是的 - 你做出了一个新的承诺，它在 300 毫秒后被拒绝，然后你可以在fetch() 返回一个承诺时“竞速”尽可能多的获取。第一个完成的承诺得到解决。因此，如果超时承诺在获取之前被拒绝，您可以假设您的服务器无法访问。
返回超时 :( 在 android 上

【解决方案2】：

我担心是否有任何功能。但是您可以将 Fetch API 放在 javascript setTimeout() 中并给它例如 20 秒。如果您在 20 秒内没有得到结果，则可能是服务器无法访问。

setTimeout({ this.FetchData(); }, 20000);

【讨论】：