React Native Android location request timed out

Question

In IOS there isn't a problem while looking for gps coords. It works fine.

On Android side its not stable as IOS. This problem both in real device and emulator. Sometimes it can find location, but sometimes not. Looking for 3days but there wasn't find a solution.

When my app cannot find my location, I tried via Google Maps app, it works like charm.

Here is my code for both IOS and Android;

getCurrentPosition() {
    navigator.geolocation.getCurrentPosition(
        (position) => {
            this.setState({ initialPosition: position });
            alert(JSON.stringify(position))
            var coords = new Coords();
            coords.Latitude = position.coords.latitude;
            coords.Longitude = position.coords.longitude;
            this.getPharmaciesByCoordinates(coords);
        },
        (error) => alert(error.message),
        { enableHighAccuracy: true, timeout: 20000, maximumAge: 1000 }
    );
    this.watchID = navigator.geolocation.watchPosition((position) => {
        this.setState({ initialPosition: position });
    },
        (error) => alert(error.message),
        { enableHighAccuracy: true, timeout: 20000, maximumAge: 1000 }
    );
}

Any kind of solution is welcome.

Thanks

Answer 1

I removed maximumAge: 3600000 on Android and it working

Answer 2

It's possible that you are inside of the building or office and your signal is not that good. I've tried with many configuration and this one fit the best for me:

{
    enableHighAccuracy: false,
    timeout: 5000,
    maximumAge: 10000
}

Or try increasing timeout. Because for me the usual 2000ms wasn't working, I kept getting "Location request timed out". So disable high accuracy, increase timeout and you're good to go.

Answer 3

Hi I was facing same issue "request time out ". I have tried every possible solution which I found but, those could not work for me but recently I found one module which overcomes this problem. react-native-geolocation-service This worked for me .....

Answer 4

I found a solution via external lib that uses native LocationManager. It uses play services location and emitting location event as I want.

Here is the library; https://bitbucket.org/timhagn/react-native-google-locations#readme

And when compiling for android, don't forget to include android/app/build.gradle

dependencies {
    ...
    compile "com.google.android.gms:play-services:10.0.1" -> which version that you have write down here.
    ...
}

And finally don't forget to download Google Play Services and Google Support Library in Android SDK Manager you can find your play services versions into;

<android-sdk-location>/<sdk-version>/extras/google/m2repository/com/google/android/gms/play-services

Answer 5

I have done the app by location request. The command
{ enableHighAccuracy: true, timeout: 25000, maximumAge: 3600000 }, will work on iOS but not in Android. I think you should check Platform.

navigator.geolocation.getCurrentPosition(
          (location) => {
            console.log('location ', location);
            if (this.validLocation(location.coords)) {
              this.locationToAddress(location.coords);
            }
          },
          (error) => {
            console.log('request location error', error);
          },
          Platform.OS === 'android' ? {} : { enableHighAccuracy: true, timeout: 20000, maximumAge: 10000  }
        );

Answer 6

I tried various methods and npm modules. Finally I got solved this issue by using this module. I strongly suggest this. https://www.npmjs.com/package/react-native-geolocation-service

Answer 7

Working { enableHighAccuracy: false, timeout: 5000, maximumAge: 10000 },

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

Add Permission in P list and android Manifest also

import React, { Component } from 'react';
import { View, Text } from 'react-native';

export default class App extends Component {
  constructor(props) {
    super(props);

    this.state = {
      latitude: null,
      longitude: null,
      error: null,
    };
  }

  componentDidMount() {
    navigator.geolocation.getCurrentPosition(
      (position) => {
        this.setState({
          latitude: position.coords.latitude,
          longitude: position.coords.longitude,
          error: null,
        });
      },
      (error) => this.setState({ error: error.message }),
      { enableHighAccuracy: false, timeout: 5000, maximumAge: 10000 },
      // { enableHighAccuracy: true, timeout: 20000, maximumAge: 1000 },
    );
  }

  render() {
    return (
      <View style={{ flexGrow: 1, alignItems: 'center', justifyContent: 'center' }}>
        <Text>Latitude: {this.state.latitude}</Text>
        <Text>Longitude: {this.state.longitude}</Text>
        {this.state.error ? <Text>Error: {this.state.error}</Text> : null}
      </View>
    );
  }
}

Answer 8

the tricks is, if you set

{ enableHighAccuracy: true, timeout: 25000, maximumAge: 3600000 } 

then it will work. full code below.

import React, { Component } from 'react';
import { View, Text } from 'react-native';

class GeolocationExample extends Component {
constructor(props) {
super(props);

this.state = {
  latitude: null,
  longitude: null,
  error: null,
};
}

componentDidMount() {
navigator.geolocation.getCurrentPosition(
  (position) => {
    this.setState({
      latitude: position.coords.latitude,
      longitude: position.coords.longitude,
      error: null,
       });
       },
  (error) => this.setState({ error: error.message }),
  { enableHighAccuracy: true, timeout: 25000, maximumAge: 3600000 },
);}

 render() {
return (
  <View style={{ flexGrow: 1, alignItems: 'center', justifyContent: 'center' }}>
    <Text>Latitude: {this.state.latitude}</Text>
    <Text>Longitude: {this.state.longitude}</Text>
    {this.state.error ? <Text>Error: {this.state.error}</Text> : null}
  </View>
  );
 }
}

export default GeolocationExample;