如何在运行时在React Native中请求Android设备位置权限?

nhhxz33t  于 2022-12-28  发布在  Android
关注(0)|答案(6)|浏览(200)

我一直在尝试将React Native的GeoLocalisation用于一个Android应用程序。在https://facebook.github.io/react-native/docs/geolocation.html中可以找到文档化较差的模块。根据文档,您可以使用AndroidManifest.xml文件中的以下代码处理Android上的位置权限

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

但是,我的在线研究表明,上面的代码行对于ANDROID >= 6.0版本是无用的
由于我的GeoLocation实现目前不起作用,我没有其他理由,只能相信位置权限没有得到正确处理。
如何在运行时成功请求React Native Android应用的位置权限?

8mmmxcuj

8mmmxcuj1#

我通过修改android/app/build.gradle中的targetSdkVersion(与compileSdkVersion相同,在我的例子中为23)解决了这个问题。
编辑位于android/src/main中的AndroidManifest.xml并添加

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

下一篇:

import { PermissionsAndroid } from 'react-native';

然后添加此方法:

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)
  }
}

并在运行时请求位置时访问该方法

async componentWillMount() {
    await requestLocationPermission()
}
ryoqjall

ryoqjall2#

这对我没用

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

我引用了https://facebook.github.io/react-native/docs/permissionsandroid.html#request,check()返回一个布尔值

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" )
}
slwdgvem

slwdgvem3#

您可以使用react原生PermissionsAndroid来请求权限:https://facebook.github.io/react-native/docs/permissionsandroid.html#request
或者,更简单的选择是使用一个为您执行此操作的库,例如https://github.com/yonahforst/react-native-permissions

qjp7pelc

qjp7pelc4#

我注意到两件事:
1.必须更改build.gradle文件中的compileSdkVersion 23
1.您必须添加视图的单击侦听器才能显示到权限对话框

    • 样品代码:**
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>
        )
    }
}

希望这对你有帮助。

zvokhttg

zvokhttg5#

您可以使用以下代码请求位置权限

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');
j13ufse2

j13ufse26#

在清单中

<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()
    }
}

相关问题