web-dev-qa-db-ja.com

反応ネイティブアプリでネットワークステータスを確認する方法

私はこの点について苦労しています、モバイルでネットワーク接続が悪い場合、サービスを呼び出す方法がいくつかありますが、サービスを呼び出すにはより時間がかかります

  • フェッチタイムアウトを増やす可能性はありますか（または）

  • Uがインターネットに接続されていないことをユーザーに伝える方法。

    インターネット接続の確認にはnetworkInfoを使用しましたが、接続の有無のみが役立ちますが、ネットワークの速度に関する情報は提供されません。

可能であれば、誰も私に提案することができます、これをどのように解決できますか？react-native version：0.29.

react-nativereact-native-androidreact-native-ios
11
Hussian Shaik

デバイスにアクティブなインターネット接続があるかどうかだけを知りたい場合は、たとえば isConnected from React Native's NetInfo ：

import { NetInfo } from "react-native";

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

しかし、接続がどれほど良いかを知る方法はわかりません。

11
ArneHugo
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のいずれであるかを指定します。

4
Dansmog

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

0
Gaurav Roy

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',
}

**

0
sahil555

以下に例を示します。

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.!!! ")
}
0
Pratik Panchal