React Nativeでのネットワーク情報の取得方法と例

1. ネットワークの接続状態を確認する:

React Nativeでは、NetInfoクラスを使用してネットワークの接続状態を確認することができます。以下は、接続状態を取得する例です。

import NetInfo from '@react-native-community/netinfo';
NetInfo.fetch().then(state => {
  console.log('Connection type:', state.type);
  console.log('Is connected?', state.isConnected);
});

2. オンライン/オフラインの変更を監視する:

ネットワークのオンライン/オフラインの変更を監視するためには、NetInfo.addEventListener()メソッドを使用します。以下は、変更を監視する例です。

import NetInfo from '@react-native-community/netinfo';
const unsubscribe = NetInfo.addEventListener(state => {
  console.log('Connection type:', state.type);
  console.log('Is connected?', state.isConnected);
});
// 監視を停止する場合は、unsubscribe()を呼び出します。

3. ネットワークの詳細情報を取得する:

NetInfoクラスは、ネットワークの詳細情報も提供しています。以下は、詳細情報を取得する例です。

import NetInfo from '@react-native-community/netinfo';
NetInfo.fetch().then(state => {
  console.log('Connection type:', state.type);
  console.log('Is connected?', state.isConnected);
  console.log('Is WiFi?', state.isWifiEnabled);
  console.log('Is cellular?', state.isCellularEnabled);
  console.log('Is VPN?', state.isVpnEnabled);
});