How do I request multiple permissions at once in react native - permissions

Question

I'd like to request permissions on one page instead of waiting for each particular situation. However, I do not want multiple popups. Is there a way to ask for permissions with a single popup/modal.
On the android side I found this post and this, which look promising, but I have yet to find something for iOS.

Answer 1

In Android
First add permissions in to the AndroidManifest.xml file and then
if (Platform.OS === 'android') {
PermissionsAndroid.requestMultiple(
[PermissionsAndroid.PERMISSIONS.CAMERA,
PermissionsAndroid.PERMISSIONS.READ_CONTACTS,
PermissionsAndroid.PERMISSIONS.ACCESS_FINE_LOCATION,
PermissionsAndroid.PERMISSIONS.ACCESS_COARSE_LOCATION,
PermissionsAndroid.PERMISSIONS.READ_EXTERNAL_STORAGE,
PermissionsAndroid.PERMISSIONS.WRITE_EXTERNAL_STORAGE]
).then((result) => {
if (result['android.permission.ACCESS_COARSE_LOCATION']
&& result['android.permission.CAMERA']
&& result['android.permission.READ_CONTACTS']
&& result['android.permission.ACCESS_FINE_LOCATION']
&& result['android.permission.READ_EXTERNAL_STORAGE']
&& result['android.permission.WRITE_EXTERNAL_STORAGE'] === 'granted') {
this.setState({
permissionsGranted: true
});
} else if (result['android.permission.ACCESS_COARSE_LOCATION']
|| result['android.permission.CAMERA']
|| result['android.permission.READ_CONTACTS']
|| result['android.permission.ACCESS_FINE_LOCATION']
|| result['android.permission.READ_EXTERNAL_STORAGE']
|| result['android.permission.WRITE_EXTERNAL_STORAGE'] === 'never_ask_again') {
this.refs.toast.show('Please Go into Settings -> Applications -> APP_NAME -> Permissions and Allow permissions to continue');
}
});
}
In iOS
In the info section of your project on XCode
Add the permissions and the description
say - ex: Privacy - Contacts Usage Description
then,
Permissions.request('photo').then(response => {
if (response === 'authorized') {
iPhotoPermission = true;
}
Permissions.request('contact').then(response => {
if (response === 'authorized') {
iPhotoPermission = true;
}
});
});

Answer 2

Makes sure you also add respective permissions in manifest file as well.
export async function GetAllPermissions() {
try {
if (Platform.OS === "android") {
const userResponse = await PermissionsAndroid.requestMultiple([
PermissionsAndroid.PERMISSIONS.READ_CONTACTS,
PermissionsAndroid.PERMISSIONS.CALL_PHONE
]);
return userResponse;
}
} catch (err) {
Warning(err);
}
return null;
}

Answer 3

To request multiple permissions I will suggest you to use npm module as its saves time and easy to setup and most important you don't have to worry about the platforms :)
Installation
npm install --save react-native-permissions
Usage
import Permissions from 'react-native-permissions'
// Check the status of multiple permissions
_checkCameraAndPhotos = () => {
Permissions.checkMultiple(['camera', 'photo']).then(response => {
//response is an object mapping type to permission
this.setState({
cameraPermission: response.camera,
photoPermission: response.photo,
})
})
}
Don't forget to add permissions to AndroidManifest.xml for android and Info.plist for iOS (Xcode >= 8).

Answer 4

First add your permissions to "android/app/src/main/AndroidManifest.xml" file. You can use npm module in order to achieve your goal.
npm install --save react-native-permissions
After installation, you can use checkMultiple function to ask multiple permissions. Following code illustrates how to ask permission for ANDROID.CAMERA and ANDROID.READ_EXTERNAL_STORAGE :
checkMultiple([
PERMISSIONS.ANDROID.CAMERA,
PERMISSIONS.ANDROID.READ_EXTERNAL_STORAGE,
]).then(result => {
console.log(result);
});
The result will be an object like this
{"android.permission.CAMERA": "denied", "android.permission.READ_EXTERNAL_STORAGE": "denied"}
To handle this result, you can use this basic code example
checkPermissions = () => {
if (Platform.OS !== 'android') {
return;
}
checkMultiple([
PERMISSIONS.ANDROID.CAMERA,
PERMISSIONS.ANDROID.READ_EXTERNAL_STORAGE,
]).then(result => {
if (
!result ||
!result[PERMISSIONS.ANDROID.CAMERA] ||
!result[PERMISSIONS.ANDROID.READ_EXTERNAL_STORAGE]
) {
console.log('could not get any result. Please try later.');
}
if (
result[PERMISSIONS.ANDROID.CAMERA] === RESULTS.GRANTED &&
result[PERMISSIONS.ANDROID.READ_EXTERNAL_STORAGE] === RESULTS.GRANTED
) {
console.log('granted for both permissions');
// do smthing here
}
});
};

Answer 5

There is also a way to request multiple permissions at once using react-native-permissions package.
you can also implement your own conditions according to need, i am just writing a simple solution
requestMultiple will not ask again if permissions are already granted.
import { checkMultiple, requestMultiple, PERMISSIONS } from 'react-native-permissions';
const verifyPermissions = async () => {
let perm = [ PERMISSIONS.IOS.CAMERA, PERMISSIONS.IOS.PHOTO_LIBRARY ];
if (Platform.OS == 'android') {
perm = [ PERMISSIONS.ANDROID.CAMERA, PERMISSIONS.ANDROID.READ_EXTERNAL_STORAGE ];
}
let permissionStatuses = await requestMultiple(perm);
console.log('obj', permissionStatuses);
console.log('Camera', permissionStatuses[perm[0]]);
console.log('photo', permissionStatuses[[ perm[1] ]]);
const result = permissionStatuses[perm[0]];
if (result !== 'granted') {
Alert.alert('Insufficient permissions!', 'You need to grant camera and library access permissions to use this app.', [
{ text: 'Okay' }
]);
return false;
}
return true;
};