Ameen OT
Ameen OT

Reputation: 170

React Native app Netinfo returns as unknown

I am building an app using react native but it's not fetching data using axios only in ios, Android its working fine

When i checked the status of network using Netinfo it is returning unknown

 componentWillMount() {


    this.getLocation().done();


    var cusineServiceParams = {
      'limit': '6',
      'offset': '0',
    };
    axios.post('http://www.some.preview.domain.com/api/gc', cusineServiceParams)
      .then(function (response) {
        this.setState({
          cusineList: response.data
        })
      }.bind(this))
      .catch(function (error) {
        alert('connection error');
      });

  }

I am always getting connection error

Here is my info.plist

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
    <key>CFBundleDevelopmentRegion</key>
    <string>en</string>
    <key>CFBundleDisplayName</key>
    <string>SOMEAPP</string>
    <key>CFBundleExecutable</key>
    <string>$(EXECUTABLE_NAME)</string>
    <key>CFBundleIdentifier</key>
    <string>org.reactjs.native.example.somea</string>
    <key>CFBundleInfoDictionaryVersion</key>
    <string>6.0</string>
    <key>CFBundleName</key>
    <string>SomeApp</string>
    <key>CFBundlePackageType</key>
    <string>APPL</string>
    <key>CFBundleShortVersionString</key>
    <string>1.0</string>
    <key>CFBundleSignature</key>
    <string>????</string>
    <key>CFBundleVersion</key>
    <string>1</string>
    <key>LSRequiresIPhoneOS</key>
    <true/>
    <key>NSAppTransportSecurity</key>
    <dict>
        <key>NSExceptionDomains</key>
        <dict>
            <key>localhost</key>
            <dict>
                <key>NSExceptionAllowsInsecureHTTPLoads</key>
                <true/>
            </dict>
        </dict>
    </dict>
    <key>NSExceptionDomains</key>
    <dict>
        <key>localhost</key>
        <dict>
            <key>NSTemporaryExceptionAllowsInsecureHTTPLoads</key>
            <true/>
        </dict>
    </dict>
    <key>NSLocationWhenInUseUsageDescription</key>
    <string></string>
    <key>UIAppFonts</key>
    <array>
        <string>Andale Mono.ttf</string>
        <string>Arial Black.ttf</string>
        <string>Arial.ttf</string>
        <string>Comic Sans MS.ttf</string>
        <string>Courier New.ttf</string>
        <string>Entypo.ttf</string>
        <string>EvilIcons.ttf</string>
        <string>FontAwesome.ttf</string>
        <string>Foundation.ttf</string>
        <string>Georgia.ttf</string>
        <string>Ionicons.ttf</string>
        <string>MaterialIcons.ttf</string>
        <string>Microsoft Sans Serif.ttf</string>
        <string>Octicons.ttf</string>
        <string>Roboto.ttf</string>
        <string>Roboto_medium.ttf</string>
        <string>Rubik-Black.ttf</string>
        <string>Rubik-BlackItalic.ttf</string>
        <string>Rubik-Bold.ttf</string>
        <string>Rubik-BoldItalic.ttf</string>
        <string>Rubik-Italic.ttf</string>
        <string>Rubik-Light.ttf</string>
        <string>Rubik-LightItalic.ttf</string>
        <string>Rubik-Medium.ttf</string>
        <string>Rubik-MediumItalic.ttf</string>
        <string>Rubik-Regular.ttf</string>
        <string>SF-UI-Text-Regular.otf</string>
        <string>SanFrancisco.ttf</string>
        <string>SanFranciscoBold.ttf</string>
        <string>SanFranciscoThin.ttf</string>
        <string>SimpleLineIcons.ttf</string>
        <string>Skia.ttf</string>
        <string>Times New Roman.ttf</string>
        <string>Zocial.ttf</string>
        <string>rubicon-icon-font.ttf</string>
        <string>MaterialCommunityIcons.ttf</string>
    </array>
    <key>UIBackgroundModes</key>
    <array>
        <string>fetch</string>
        <string>location</string>
        <string>remote-notification</string>
    </array>
    <key>UILaunchStoryboardName</key>
    <string>LaunchScreen</string>
    <key>UIRequiredDeviceCapabilities</key>
    <array>
        <string>armv7</string>
    </array>
    <key>UISupportedInterfaceOrientations</key>
    <array>
        <string>UIInterfaceOrientationPortrait</string>
        <string>UIInterfaceOrientationLandscapeLeft</string>
        <string>UIInterfaceOrientationLandscapeRight</string>
    </array>
    <key>UIViewControllerBasedStatusBarAppearance</key>
    <false/>
</dict>
</plist>

Upvotes: 3

Views: 1814

Answers (1)

Swapnil Panchal
Swapnil Panchal

Reputation: 407

Steps for checking internet connection:

  1. put this in import "NetInfo"

  2. add this line in componentwillMount()

    NetInfo.isConnected.addEventListener('change', this.handleConnectionChange);
    
      NetInfo.isConnected.fetch().done(
        (isConnected) => { this.setState({ netStatus: isConnected }); }
      );
    
      NetInfo.isConnected.fetch().done((isConnected) => {
    
      if (isConnected)
      {
        //Put your code here when internet is connected
      }else{
       // Alert for no internet
      }
     });
    
    componentDidMount()
         {
           NetInfo.isConnected.addEventListener('change', this.handleConnectionChange);
    
           NetInfo.isConnected.fetch().done(
             (isConnected) => { this.setState({ netStatus: isConnected }); }
           );
         }
       //method
       handleConnectionChange = (isConnected) => {
               this.setState({ netStatus: isConnected });
               console.log(`is connected: ${this.state.netStatus}`);
             }
    

Upvotes: 4

Related Questions