Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

navigator.geolocation:: Location request timed out issue React Native

I am building a React Native app and trying to get my current geocodes using navigator.geolocation It shows me an error of Location request Time out. Basically I am building a tracking app and I need to configure the exact location latitude longitude. To start tracking there is one button and click of this tracking would be start and it should be the initial point for tracking. I am using default react native geolocation API, Link https://facebook.github.io/react-native/docs/geolocation Function to get my current location::

getLocation() {
    navigator.geolocation.getCurrentPosition(response => {
        console.log(response);
        if (response && response.coords) {
            this.saveLogs(response.coords);
        }
    },
        (error) => {
            this.onGeolocationErrorOccurCallback(error);
        },
        GeolocationOptions
    )
}

It shows me an Error::

{"TIMEOUT":3,"POSITION_UNAVAILABLE":2,"PERMISSION_DENIED":1,"message":"Location request timed out", "code":3}

I have added permission for Android device, and also checking by set enableHighAccuracy value to false. But it's not working for me. And I need to set enableHighAccuracy to true because I want exact geocodes to track someone. Please suggest why Location request timed out is occurring here??

like image 948
Archana Sharma Avatar asked Jan 24 '19 09:01

Archana Sharma


2 Answers

The code below worked for me:

componentDidMount(){
   if(Platform.OS === 'android'){
      this.requestLocationPermission()
   }else{
      this._getCurrentLocation()
   }
}

async requestLocationPermission() {
    try {
        const granted = await PermissionsAndroid.request(
        PermissionsAndroid.PERMISSIONS.ACCESS_FINE_LOCATION,
        {
          'title': 'Location Permission',
          'message': 'MyMapApp needs access to your location'
        }
        )

       if (granted === PermissionsAndroid.RESULTS.GRANTED) {
           this._getCurrentLocation()
           console.log("Location permission granted")
       } else {
           console.log("Location permission denied")
       }
    } catch (err) {
       console.warn(err)
    }
}

_getCurrentLocation = () =>{
    navigator.geolocation.getCurrentPosition(
       (position) => {
       this.setState({
          latitude: position.coords.latitude,
          longitude: position.coords.longitude, 
       })
    },
    (error) => {
        this.setState({ error: error.message })},
        { enableHighAccuracy: true, timeout: 200000, maximumAge: 1000 },
    );
}

Permission in Manifest file:

<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />

Just make sure your location is enabled.

like image 112
Shubham Raitka Avatar answered Sep 18 '22 07:09

Shubham Raitka


UPDATE: 2021 June 12,

This approach works for me in Android Emulator. "react-native": "0.64.1" and Android API 30

import Geolocation from "@react-native-community/geolocation";

const getGeoLocaation = () => {
  const config = {
    enableHighAccuracy: true,
    timeout: 2000,
    maximumAge: 3600000,
  };

  Geolocation.getCurrentPosition(
    info => console.log("INFO", info),
    error => console.log("ERROR", error),
    config,
  );
};
like image 24
Hashan Shalitha Avatar answered Sep 18 '22 07:09

Hashan Shalitha