我如何在 运行 时在 React Native 中请求 Android 设备位置的权限?
How do I request permission for Android Device Location in React Native at run-time?
我一直在尝试将 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 应用程序成功请求位置权限?
提前致谢!
你可以使用react native PermissionsAndroid来请求权限:https://facebook.github.io/react-native/docs/permissionsandroid.html#request
或者,一个更简单的选择是使用一个为您做这件事的库,例如 https://github.com/yonahforst/react-native-permissions
我注意到两件事:
- 您必须更改
build.gradle
文件中的 compileSdkVersion 23
- 您必须添加 View 的点击侦听器 才能显示到 Permission 对话框。
示例代码:
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>
)
}
}
希望对您有所帮助。
这对我不起作用
if (granted === PermissionsAndroid.RESULTS.GRANTED) {
}
我提到了https://facebook.github.io/react-native/docs/permissionsandroid.html#request
和 check() return 一个布尔值
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" )
}
我通过更改targetSdkVersion
(与compileSdkVersion相同,在我的例子中是23)解决了这个问题android/app/build.gradle
。
编辑 AndroidManifest.xml 位于 android/src/main 并添加
<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()
}
您可以使用以下代码请求位置权限
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');
在清单中
<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"/>
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()
}
}
我一直在尝试将 React Native 的 GeoLocalisation 用于 Android 应用程序。文档不足的模块可在此处 https://facebook.github.io/react-native/docs/geolocation.html 找到。
根据文档,您使用 AndroidManifest.xml
文件
<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
但是,我的在线研究表明,上面的代码行对于 ANDROID >= 6.0
由于我的 GeoLocation 实现目前无法正常工作,我没有其他理由只能相信位置权限没有得到正确处理。
如何在 运行 时为 React Native Android 应用程序成功请求位置权限? 提前致谢!
你可以使用react native PermissionsAndroid来请求权限:https://facebook.github.io/react-native/docs/permissionsandroid.html#request
或者,一个更简单的选择是使用一个为您做这件事的库,例如 https://github.com/yonahforst/react-native-permissions
我注意到两件事:
- 您必须更改
build.gradle
文件中的compileSdkVersion 23
- 您必须添加 View 的点击侦听器 才能显示到 Permission 对话框。
示例代码:
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>
)
}
}
希望对您有所帮助。
这对我不起作用
if (granted === PermissionsAndroid.RESULTS.GRANTED) {
}
我提到了https://facebook.github.io/react-native/docs/permissionsandroid.html#request 和 check() return 一个布尔值
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" )
}
我通过更改targetSdkVersion
(与compileSdkVersion相同,在我的例子中是23)解决了这个问题android/app/build.gradle
。
编辑 AndroidManifest.xml 位于 android/src/main 并添加
<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()
}
您可以使用以下代码请求位置权限
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');
在清单中
<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"/>
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()
}
}