Question

我正在努力解决这一问题，如果在我的手机中我的网络连接不良，有些我如何调用该服务，则需要更多时间来调用该服务

是否有可能增加提取超时（或）
如何告诉用户您的互联网连接不佳。

为了检查互联网连接，我使用了networkInfo，但它只对连接是否有帮助，但它没有提供任何有关网络速度的信息。

如果可能，任何人都可以给我一些建议，如何解决这个问题，任何帮助都非常感激我使用 react-native版本：0.29.0

Answer 1

如果您只是想知道设备是否具有有效的互联网连接，您可以使用例如来自React Native isConnected的NetInfo：

import { NetInfo } from "react-native";

NetInfo.isConnected.addEventListener(
  "connectionChange",
  hasInternetConnection =>
    console.debug("hasInternetConnection:", hasInternetConnection)
);

但是我不知道如何找出连接有多好。

Answer 2

NetInfo.getConnectionInfo().then((connectionInfo) => {
  console.log('Initial, type: ' + connectionInfo.type + ', effectiveType: '    + connectionInfo.effectiveType);
});
function handleFirstConnectivityChange(connectionInfo) {
  console.log('First change, type: ' + connectionInfo.type + ', effectiveType: ' + connectionInfo.effectiveType);
  NetInfo.removeEventListener(
    'connectionChange',
    handleFirstConnectivityChange
  );
}
NetInfo.addEventListener(
  'connectionChange',
  handleFirstConnectivityChange
);

这是react-native documentation中代码的副本，有效类型指定网络是2G，3G，EDGE还是4G。

Answer 3

在react native 0.60中，不建议直接从react native包中导入netinfo。您必须使用从顶部的“ @ react-native-community / netinfo”导入NetInfo； 及其不同的程序包，该程序包需要链接到本机代码。然后，您可以使用以前使用过的NetInfo函数，如

NetInfo.isConnected.addEventListener( "connectionChange", hasInternetConnection => console.debug("hasInternetConnection:", hasInternetConnection) );

请检查Github文档中是否有相同的React native netinfo

Answer 4

这里是示例：

import { NetInfo,Alert } from 'react-native';

const netStatus = await NetInfo.fetch()  

if (netStatus === 'none' || netStatus === 'NONE') {
    Alert.alert("Internet not connected.!!!")
    return []
}else{ 
    Alert.alert("Internet connected.!!! ")
}

Answer 5

您可以使用名为react-native-offline的模块

以下是该网站上提供的道具

**

type Props = {
    children: React.Node,
    pingTimeout?: number = 10000,
    pingServerUrl?: string = 'https://www.google.com/',
    shouldPing?: boolean = true,
    pingInterval?: number = 0,
    pingOnlyIfOffline?: boolean = false,
    pingInBackground?: boolean = false,
    httpMethod?: HTTPMethod = 'HEAD',
}

**

Answer 6

stackoverflow的许多地方都提到了这个问题。对于较新版本的react native，您应该使用“ @ react-native-community / netinfo”库。 NetInfo曾经是react-native的一部分，但是后来它脱离了核心。如果要观察网络状态的变化，请使用提供的addEventListener方法。

import NetInfo from "@react-native-community/netinfo";

NetInfo.fetch().then(state => {
    console.log("Connection type", state.type);
    console.log("Is connected?", state.isConnected);
});

const unsubscribe = NetInfo.addEventListener(state => {
    console.log("Connection type", state.type);
    console.log("Is connected?", state.isConnected);
});

// Unsubscribe
unsubscribe();

如何检查react-native应用程序中的网络状态

6 个答案: