Ask Run Time Android Permission using React Native PermissionsAndroid

Ask Run Time Android Permission using React Native PermissionsAndroid

The post, Ask Run Time Android Permission using React Native PermissionsAndroid includes

  • What is Android Permission?
  • Why we have to ask for permission?
  • How to ask for Permission in Android?
  • How to ask run time Permission in React Native?
  • Example to ask for the run time permission.

So Let’s get started.

What is Android Permission?

According to Google’s privacy policy, a user should know which application is trying to access sensitive data such as files, contacts and SMS, as well as certain system features such as camera and internet. So they introduced Android Permission feature.

In Android permission modal every applications which is using sensitive data or some certain system features have to ask for the permissions from user.

The purpose of permission is to protect the privacy of an Android user.

Why We have to Ask for Permission?

Android applies the permission modal because some of the applications were tracking the user’s location in the background and accessing the private data like contacts, call history and messages without informing the user which is the violation of googles privacy policy.

So to solve this sensitive issue application have to ask for permission to access those sensitive data.

How to Ask for Permission in Android?

Now you have an idea about the Android permission, let’s see how to ask for the permission in Android.

To ask for permission in Android you have to follow two steps:

1. You have to add those permissions requests in project -> app -> src -> AndroidManifest.xml file.

For Example, if we want to ask for the Camera Permission we have to add the following permission request in AndroidManifest.xml

After adding the permission in AndroidManifest file, this permission will be automatically asked by the play store when they install the app and this permission will be granted to the applications.

On devices before SDK version 23, the permissions are automatically granted if we add those permissions in our Androidmanifest.xml file but after SDK version 23 you have to ask runtime permission as well. If you are targeting the Android version < 23 then you can skip 2nd point.

2. After Google’s new permission modal they have introduced the run time permission mechanism in Android version 23. According to that, you have to include all the permissions in AndroidManifest.xml and also have to ask for some of the dangerous permissions in run time (You don’t have to ask for all the permission just some permission which are called dangerous permissions, you can see the list below).

According to the official docs, dangerous permissions require a dialog prompt.

So whenever you are working with this dangerous permissions you need to check whether the permission is granted by the user or not and that can be done with the help of PermissionsAndroid in React Native.

For example, If we need INTERNET permission and CAMERA permission then we have to add both the permission in AndroidManifest.xml file but have to ask only for the CAMERA permission in run time because CAMERA permission comes under the dangerous permission not INTERNET permission.

Here is the list of dangerous permissions.

Run Time Permissions that Requires Confirmation from the User

READ_CALENDARandroid.permission.READ_CALENDAR
WRITE_CALENDARandroid.permission.WRITE_CALENDAR
CAMERAandroid.permission.CAMERA
READ_CONTACTSandroid.permission.READ_CONTACTS
WRITE_CONTACTSandroid.permission.WRITE_CONTACTS
GET_ACCOUNTSandroid.permission.GET_ACCOUNTS
ACCESS_FINE_LOCATIONandroid.permission.ACCESS_FINE_LOCATION
ACCESS_COARSE_LOCATIONandroid.permission.ACCESS_COARSE_LOCATION
RECORD_AUDIOandroid.permission.RECORD_AUDIO
READ_PHONE_STATEandroid.permission.READ_PHONE_STATE
CALL_PHONEandroid.permission.CALL_PHONE
READ_CALL_LOGandroid.permission.READ_CALL_LOG
WRITE_CALL_LOGandroid.permission.WRITE_CALL_LOG
ADD_VOICEMAILcom.android.voicemail
USE_SIPandroid.permission.USE_SIP
PROCESS_OUTGOING_CALLSandroid.permission.PROCESS_OUTGOING_CALLS
BODY_SENSORSandroid.permission.BODY_SENSORS
SEND_SMSandroid.permission.SEND_SMS
RECEIVE_SMSandroid.permission.RECEIVE_SMS
READ_SMSandroid.permission.READ_SMS
RECEIVE_WAP_PUSHandroid.permission.RECEIVE_WAP_PUSH
RECEIVE_MMSandroid.permission.RECEIVE_MMS
READ_EXTERNAL_STORAGEandroid.permission.READ_EXTERNAL_STORAGE
WRITE_EXTERNAL_STORAGEandroid.permission.WRITE_EXTERNAL_STORAGE

Hope you have understood the run time permission now. Let’s have a look at how to ask for the Run Time permission in React Native.

How to Ask Run Time Android Permission using React Native PermissionsAndroid?

In React Native PermissionsAndroid component provides access to Android M’s (Over API level 23) new permissions model. You always need to check the permission before using native APIs which comes under dangerous permissions.

Above mentioned all the dangerous permissions comes under PermissionsAndroid.PERMISSIONS as constants.

You can check the permission granted or not using PermissionsAndroid.RESULTS.GRANTED

To ask for the permission use

Result Strings for Requesting Permissions

Available as constants under PermissionsAndroid.RESULTS:

ResponseResult
GRANTEDPermission granted successfully by the user
DENIEDPermission denied by the user
NEVER_ASK_AGAINPermission denied by the user with never ask again.

Now we have an idea about Android permissions and components. Let’s move towards the Example which can help you to ask permission in your application.

Example to Ask for the Run Time Permission

In this example, we will ask for the camera permission which needs run time permission. We are making an button on the centre of the screen and on click of button we will ask for the run time permission for CAMERA. So let’s get started.

To Make a React Native App

Getting started with React Native will help you to know more about the way you can make a React Native project. We are going to use react-native init to make our React Native App. Assuming that you have node installed, you can use npm to install the react-native-cli command line utility. Open the terminal and go to the workspace and run

npm install -g react-native-cli

Run the following commands to create a new React Native project

react-native init ProjectName

If you want to start a new project with a specific React Native version, you can use the --version argument:

react-native init ProjectName --version X.XX.X
react-native init ProjectName --version react-native@next

This will make a project structure with an index file named App.js in your project directory.

If you are using anything in your app that needs permission you need to add it in AndroidManifest.xml. For this example we are adding camera permission in AndroidManifest.xml.


Now jump into the project using

Open App.js in any code editor and replace the code with the following code.

App.js

Here PermissionsAndroid.request have two arguments:

  1. PermissionsAndroid.PERMISSIONS.CAMERA to generate a dialog to ask for CAMERA Permission.
  2. A JSON {‘title’:”,’message’:”}, which will help you to communicate or to show the dialog about the requirement of the permission if the user denied the permission. It will be generated like this.

To Run the React Native App

Open the terminal again and jump into your project using.
cd ProjectName
To run the project on an Android Virtual Device or on real debugging device
react-native run-android
or on the iOS Simulator by running
react-native run-ios (macOS only).
       

That was the React Native Android Permission. If you have any doubt or you want to share something about the topic you can comment below or contact us here. The remaining components will be covered in the next article. Stay tuned!

Hope you liked it. 🙂

Leave a Comment

This site uses Akismet to reduce spam. Learn how your comment data is processed.