Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

React native geolocation service not working for iOS

I am trying to get device current position in react native. I am using below library for get the location:

react-native-geolocation-service

My code:

try {
        const granted = await PermissionsAndroid.request(
          PermissionsAndroid.PERMISSIONS.ACCESS_FINE_LOCATION,
          {
            title: 'Device current location permission',
            message:
              'Allow app to get your current location',
            buttonNeutral: 'Ask Me Later',
            buttonNegative: 'Cancel',
            buttonPositive: 'OK',
          },
        );
        if (granted === PermissionsAndroid.RESULTS.GRANTED) {
          this.getCurrentLocation();
        } else {
          console.log('Location permission denied');
        }
      } catch (err) {
        console.warn(err);
      }
     }

getCurrentLocation(){
     Geolocation.requestAuthorization();
     Geolocation.getCurrentPosition(
        (position) => {
            alert(position.coords.latitude);
            this.socket.emit('position', {
               data: position,
               id: this.id,
             });
        },
        (error) => {
          alert("map error: "+error.message);
            console.log(error.code, error.message);
        },
        { enableHighAccuracy: true, timeout: 15000, maximumAge: 10000 }
    );
   }

Android is working fine and getting the correct location but for IOS it's not working Also, it's not asking for allow location persmission. I am getting below error:

PERMISSION_DENIED: 1
POSITION_UNAVAILABLE: 2
TIMEOUT: 3
code: 3
message: "Unable to fetch location within 15.0s."

This is my info.plist:

<key>NSLocationWhenInUseUsageDescription</key>
<string>$(PRODUCT_NAME) would like to access your location.</string>
<key>NSLocationAlwaysUsageDescription</key>
<string>$(PRODUCT_NAME) would like to access your location.</string>

This is background modes from xcode

enter image description here

like image 791
Rahul Mishra Avatar asked Aug 20 '19 09:08

Rahul Mishra


People also ask

How do I enable location in iOS react-native?

Geolocation is enabled by default when you create a project with react-native init . In order to enable geolocation in the background, you need to include the 'NSLocationAlwaysUsageDescription' key in Info. plist and add location as a background mode in the 'Capabilities' tab in Xcode.

How do I get location permissions in react-native?

It is important that GPS is enabled as the permissions library would not enable it even if the location permissions are enabled. To enable GPS, react-native-android-location-enabler can be used.


1 Answers

I have used the react-native-geolocation-service for getting user current location here is my code

App.js:

import Geolocation from 'react-native-geolocation-service';

async componentDidMount() {
 if(Platform.OS === 'ios'){
      this.getCurrentLocation();
    }else{
      try {
       const granted = await PermissionsAndroid.request(
         PermissionsAndroid.PERMISSIONS.ACCESS_FINE_LOCATION,
         {
           title: 'Device current location permission',
           message:
             'Allow app to get your current location',
           buttonNeutral: 'Ask Me Later',
           buttonNegative: 'Cancel',
           buttonPositive: 'OK',
         },
       );
       if (granted === PermissionsAndroid.RESULTS.GRANTED) {
         this.getCurrentLocation();
       } else {
         console.log('Location permission denied');
       }
     } catch (err) {
       console.warn(err);
     }
    }
}

getCurrentLocation(){
    Geolocation.requestAuthorization();
    Geolocation.getCurrentPosition(
       (position) => {
           console.log(position);
       },
       (error) => {
         console.log("map error: ",error);
           console.log(error.code, error.message);
       },
       { enableHighAccuracy: false, timeout: 15000, maximumAge: 10000 }
   );
  }

MapScreen.js

import Geolocation from 'react-native-geolocation-service';

componentDidMount() {
  this.updateCurrentPosiiton();
}

updateCurrentPosiiton () {
    Geolocation.getCurrentPosition(
       (position) => {
          let d_lat  =  position.coords.latitude;
          let d_lng  =  position.coords.longitude;

          this.setState({
            current_lat: position.coords.latitude,
            current_lng: position.coords.longitude
          })
          // console.log('aayaaa');
          this.props.updateGps(d_lat,d_lng);

          this.getTrackData(d_lat,d_lng);

       },
       (error) => {
         console.log("map error: ",error);
           console.log(error.code, error.message);
       },
       { enableHighAccuracy: false, timeout: 15000, maximumAge: 10000 }
   );
  }

Please let me know if any issue.

like image 167
Rahul Mishra Avatar answered Oct 22 '22 07:10

Rahul Mishra