Fixing React Native Android Permissions

Dave Hudson
2 min readJun 5, 2017

--

TLDR => React Native can sometimes add unwanted permissions for Android. This can affect your installs once on the app store. This quick tip will help you remove them.

I recently came up against the Android Permissions problem when launching an app for kids under 5. Despite the fact I did not request any special permissions the app was getting built requesting permissions for:

  • System_Alert_Window
  • Read_Phone_State

Now as a parent I’d be questioning why an app that shows Flash Cards for babies would be requesting these permissions, sounds suspicious to me!

To find out what these permissions are for you can look them up on the Android developer docs:

SYSTEM_ALERT_WINDOW

Allows an app to create windows using the type TYPE_APPLICATION_OVERLAY, shown on top of all other apps. Very few apps should use this permission; these windows are intended for system-level interaction with the user.

Turns out this is actually an important development feature for React Native. However, it has no place being in the production version of the app so lets remove it.

In the file android/app/build.gradle find the buildTypes section and add a debug section with as follows and update the release section by adding the manifestPlaceholders line.

This is a nice little trick as we still want the SYSTEM_ALERT_WINDOW permissions on a debug build just not the production one and this takes care of that.

In the file android/app/src/main/AndroidManifest.xml we can now remove the line as it is redundant:

READ_PHONE_STATE

Allows read only access to phone state, including the phone number of the device, current cellular network information, the status of any ongoing calls, and a list of any PhoneAccounts registered on the device.

So this had no business being there at all and I’m not sure why it is but it can simply be removed using tools:node=”remove”.

In android/app/src/main/AndroidManifest.xml ensure you add xmlns:tools in your manifest tag as seen in the line 2 of the code below:

Then update the READ_PHONE_STATE permissions as follows adding tools:node=”remove”:

That’s all there is to it! When you next do a production build and come to install your app it should no longer ask for those erroneous permissions.

:-)

--

--

Dave Hudson

JavaScript full stack developer, I specialise in Progressive Web Apps, React & React Native. I also Scrum Master.