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 contacts and SMS, as well as certain system features such as camera and internet.

So in Android, they have introduced an Android permission modal in which applications have to ask for the permissions if they want to use user sensitive data or some certain features.

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 App user which is the violation of googles privacy policy.

So to solve this sensitive issue we have to ask for permission.

How to Ask for Permission in Android?

Now if you have an idea about the Android permission then have a look at how to ask for permission in Android.

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

1. To ask for the permission 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 normal permissions are granted but for some permissions, you have to ask the user in runtime.

2. After Google’s new permission modal they have introduced the run time permission mechanism. According to that, you have to include all the permissions in AndroidManiifest.xml but you have to ask for the dangerous permissions in run time.

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, we have to ask for the INTERNET permission and CAMERA permission both but according to Android only CAMERA permission comes under the dangerous permission so we have to ask only for the CAMERA permission in run time.

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 needs dangerous permissions.

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

To ask for the permission you can use

Run Time Permissions that Requires Confirmation from the User

Available as constants under PermissionsAndroid.PERMISSIONS

Result Strings for Requesting Permissions

Available as constants under PermissionsAndroid.RESULTS:

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 to ask for the run time permission.

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
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 describe it in AndroidManifest.xml. For an example, we have used Camera permission here so we are adding camera permission in AndroidManifest.xml.

By adding permission in AndroidManifest.xml you are able to work with the CAMERA in devices which are lower than API 23. But if you want to access the CAMERA in higher level devices you also need to ask for the runtime permission.

Before we go to the code please do check your compileSdkVersion and targetSdkVersion is above or equal 23.

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


Here PermissionsAndroid.request have two arguments:

  1. PermissionsAndroid.PERMISSIONS.CAMERA generates a dialog to ask for 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. 🙂

How useful was this post?

Click on a star to rate us!

Average rating / 5. Vote count:

As you found this post useful...

Follow us on social media!

We are sorry that this post was not useful for you!

Let us improve this post!

Leave a Comment

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

You have successfully subscribed to the newsletter

There was an error while trying to send your request. Please try again.

About React will use the information you provide on this form to be in touch with you and to provide updates and marketing.