How do I request permission for Android Device Location in React Native at run-time?

Question

I have been trying to use React Native 's GeoLocalisation for an Android App. The poorly documentated module is found here https://facebook.github.io/react-native/docs/geolocation.html. According to the documentation, you handle location permissions on Android using the following code in the AndroidManifest.xml file

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

However, my online research suggests that the above line of code is useless for versions of ANDROID >= 6.0

As my implementation of GeoLocation is not currently working, I have no other reason but to believe that location permissions are not correctly handled.

How do I successfully request location permission at run-time for React Native Android App ? Thanks in advance !

score 40 · Answer 1 · edited Dec 29 '19 at 12:55

I solved it by changing the targetSdkVersion ( same to compileSdkVersion, in my case 23) in android/app/build.gradle.

Edit AndroidManifest.xml located in android/src/main and add the

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

import { PermissionsAndroid } from 'react-native';

and then add this method:

export async function requestLocationPermission() 
{
  try {
    const granted = await PermissionsAndroid.request(
      PermissionsAndroid.PERMISSIONS.ACCESS_FINE_LOCATION,
      {
        'title': 'Example App',
        'message': 'Example App access to your location '
      }
    )
    if (granted === PermissionsAndroid.RESULTS.GRANTED) {
      console.log("You can use the location")
      alert("You can use the location");
    } else {
      console.log("location permission denied")
      alert("Location permission denied");
    }
  } catch (err) {
    console.warn(err)
  }
}

and access the method when you request the location at run-time

async componentWillMount() {
    await requestLocationPermission()
}

It not worked for me so I just remove the await keyword from everywhere in the class. and it worked for me. — Chandni, Sep 11 '18 at 11:27

score 33 · Accepted Answer · edited May 08 '18 at 15:23

This did not work for me

if (granted === PermissionsAndroid.RESULTS.GRANTED) {
}

I referred to https://facebook.github.io/react-native/docs/permissionsandroid.html#request and check() return a boolean

const granted = await PermissionsAndroid.check( PermissionsAndroid.PERMISSIONS.ACCESS_FINE_LOCATION );

if (granted) {
  console.log( "You can use the ACCESS_FINE_LOCATION" )
} 
else {
  console.log( "ACCESS_FINE_LOCATION permission denied" )
}

score 5 · Answer 3 · answered Aug 22 '17 at 16:09

5

You could use the react native PermissionsAndroid to request the permission: https://facebook.github.io/react-native/docs/permissionsandroid.html#request

Or, an easier option will be using a library that does it for you, such as https://github.com/yonahforst/react-native-permissions

answered Aug 22 '17 at 16:09

egisp

61
3

Is there any way to ask for permissions "admin" for disable uninstall of app? – ROI Jul 01 '18 at 21:22
Getting actual actual admin permissions usually involves either rooting or manufacturer apis. at least used to. – Lassi Kinnunen Nov 06 '18 at 07:57
You link is missing, please try to fix it. – Juan Antonio Nov 08 '21 at 12:13

score 3 · Answer 4 · answered Mar 16 '18 at 07:27

I've noticed two things:

You have to change compileSdkVersion 23 in build.gradle file
You have to add your View's click listener to display to Permission dialog.

Sample code:

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

export default class RuntimePermissionSample extends React.Component {

    constructor(props) {
        super(props);
    }

    async requestLocationPermission() {
        const chckLocationPermission = PermissionsAndroid.check(PermissionsAndroid.PERMISSIONS.ACCESS_FINE_LOCATION);
        if (chckLocationPermission === PermissionsAndroid.RESULTS.GRANTED) {
            alert("You've access for the location");
        } else {
            try {
                const granted = await PermissionsAndroid.request(PermissionsAndroid.PERMISSIONS.ACCESS_FINE_LOCATION,
                    {
                        'title': 'Cool Location App required Location permission',
                        'message': 'We required Location permission in order to get device location ' +
                            'Please grant us.'
                    }
                )
                if (granted === PermissionsAndroid.RESULTS.GRANTED) {
                    alert("You've access for the location");
                } else {
                    alert("You don't have access for the location");
                }
            } catch (err) {
                alert(err)
            }
        }
    };

    render() {
        return (
            <Text
                onPress={() => this.requestLocationPermission()}>
                Request Location Permission
            </Text>
        )
    }
}

Hope this would help you.

score 3 · Answer 5 · answered Oct 25 '18 at 11:08

You can ask location permission using following code

try {
     const granted = await PermissionsAndroid.request(
       PermissionsAndroid.PERMISSIONS.ACCESS_FINE_LOCATION
     )
     if (granted === PermissionsAndroid.RESULTS.GRANTED) {
       alert("You can use the location")
     } else {
       alert("Location permission denied")
     }
   } catch (err) {
     console.warn(err)
   }
   alert('hi');

score 2 · Answer 6 · answered Dec 05 '19 at 11:36

in Manifest

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

more details

import {PermissionsAndroid} from 'react-native';

async function requestCameraPermission() {
  try {
    const granted = await PermissionsAndroid.request(
      PermissionsAndroid.PERMISSIONS.CAMERA,
      {
        title: 'Cool Photo App Camera Permission',
        message:
          'Cool Photo App needs access to your camera ' +
          'so you can take awesome pictures.',
        buttonNeutral: 'Ask Me Later',
        buttonNegative: 'Cancel',
        buttonPositive: 'OK',
      },
    );
    if (granted === PermissionsAndroid.RESULTS.GRANTED) {
      console.log('You can use the camera');
    } else {
      console.log('Camera permission denied');
    }
  } catch (err) {
    console.warn(err);
  }
}

export default class AlertDetails extends Component{

    async componentDidMount() {
        await request_storage_runtime_permission()
    }
}

Above method for requesting a permission is good ,but after applying above method if u are not able to see the Permission dialog..then do one more thing. run this cmd at your current project directory path: " adb shell pm reset-permissions" this will reset your all permission after that i my case i am able to see the permission dialog box — Deepanshu, Jul 02 '21 at 10:34

How do I request permission for Android Device Location in React Native at run-time?

6 Answers6

Linked