Vaibhav Herugu
Vaibhav Herugu

Reputation: 1102

Console.error: no permission handler detected.(React Native)

I am coding a simple react native app and am getting a console error when I run the app. It says that there is no permission handler detected and tells me to go through some steps. But I do not know how to do these steps, and if they don't work, I don't know how to solve the problem.

Here is the error:

enter image description here

Here is the podfile:

platform :ios, '9.0'
require_relative '../node_modules/@react-native-community/cli-platform-ios/native_modules'

def add_flipper_pods!(versions = {})
  versions['Flipper'] ||= '~> 0.33.1'
  versions['DoubleConversion'] ||= '1.1.7'
  versions['Flipper-Folly'] ||= '~> 2.1'
  versions['Flipper-Glog'] ||= '0.3.6'
  versions['Flipper-PeerTalk'] ||= '~> 0.0.4'
  versions['Flipper-RSocket'] ||= '~> 1.0'

  pod 'FlipperKit', versions['Flipper'], :configuration => 'Debug'
  pod 'FlipperKit/FlipperKitLayoutPlugin', versions['Flipper'], :configuration => 'Debug'
  pod 'FlipperKit/SKIOSNetworkPlugin', versions['Flipper'], :configuration => 'Debug'
  pod 'FlipperKit/FlipperKitUserDefaultsPlugin', versions['Flipper'], :configuration => 'Debug'
  pod 'FlipperKit/FlipperKitReactPlugin', versions['Flipper'], :configuration => 'Debug'

  # List all transitive dependencies for FlipperKit pods
  # to avoid them being linked in Release builds
  pod 'Flipper', versions['Flipper'], :configuration => 'Debug'
  pod 'Flipper-DoubleConversion', versions['DoubleConversion'], :configuration => 'Debug'
  pod 'Flipper-Folly', versions['Flipper-Folly'], :configuration => 'Debug'
  pod 'Flipper-Glog', versions['Flipper-Glog'], :configuration => 'Debug'
  pod 'Flipper-PeerTalk', versions['Flipper-PeerTalk'], :configuration => 'Debug'
  pod 'Flipper-RSocket', versions['Flipper-RSocket'], :configuration => 'Debug'
  pod 'FlipperKit/Core', versions['Flipper'], :configuration => 'Debug'
  pod 'FlipperKit/CppBridge', versions['Flipper'], :configuration => 'Debug'
  pod 'FlipperKit/FBCxxFollyDynamicConvert', versions['Flipper'], :configuration => 'Debug'
  pod 'FlipperKit/FBDefines', versions['Flipper'], :configuration => 'Debug'
  pod 'FlipperKit/FKPortForwarding', versions['Flipper'], :configuration => 'Debug'
  pod 'FlipperKit/FlipperKitHighlightOverlay', versions['Flipper'], :configuration => 'Debug'
  pod 'FlipperKit/FlipperKitLayoutTextSearchable', versions['Flipper'], :configuration => 'Debug'
  pod 'FlipperKit/FlipperKitNetworkPlugin', versions['Flipper'], :configuration => 'Debug'
end

# Post Install processing for Flipper
def flipper_post_install(installer)
  installer.pods_project.targets.each do |target|
    if target.name == 'YogaKit'
      target.build_configurations.each do |config|
        config.build_settings['SWIFT_VERSION'] = '4.1'
      end
    end
  end
end

target 'LocalMainStreet' do
  # Pods for LocalMainStreet
  pod 'FBLazyVector', :path => "../node_modules/react-native/Libraries/FBLazyVector"
  pod 'FBReactNativeSpec', :path => "../node_modules/react-native/Libraries/FBReactNativeSpec"
  pod 'RCTRequired', :path => "../node_modules/react-native/Libraries/RCTRequired"
  pod 'RCTTypeSafety', :path => "../node_modules/react-native/Libraries/TypeSafety"
  pod 'React', :path => '../node_modules/react-native/'
  pod 'React-Core', :path => '../node_modules/react-native/'
  pod 'React-CoreModules', :path => '../node_modules/react-native/React/CoreModules'
  pod 'React-Core/DevSupport', :path => '../node_modules/react-native/'
  pod 'React-RCTActionSheet', :path => '../node_modules/react-native/Libraries/ActionSheetIOS'
  pod 'React-RCTAnimation', :path => '../node_modules/react-native/Libraries/NativeAnimation'
  pod 'React-RCTBlob', :path => '../node_modules/react-native/Libraries/Blob'
  pod 'React-RCTImage', :path => '../node_modules/react-native/Libraries/Image'
  pod 'React-RCTLinking', :path => '../node_modules/react-native/Libraries/LinkingIOS'
  pod 'React-RCTNetwork', :path => '../node_modules/react-native/Libraries/Network'
  pod 'React-RCTSettings', :path => '../node_modules/react-native/Libraries/Settings'
  pod 'React-RCTText', :path => '../node_modules/react-native/Libraries/Text'
  pod 'React-RCTVibration', :path => '../node_modules/react-native/Libraries/Vibration'
  pod 'React-Core/RCTWebSocket', :path => '../node_modules/react-native/'

  pod 'React-cxxreact', :path => '../node_modules/react-native/ReactCommon/cxxreact'
  pod 'React-jsi', :path => '../node_modules/react-native/ReactCommon/jsi'
  pod 'React-jsiexecutor', :path => '../node_modules/react-native/ReactCommon/jsiexecutor'
  pod 'React-jsinspector', :path => '../node_modules/react-native/ReactCommon/jsinspector'
  pod 'ReactCommon/callinvoker', :path => "../node_modules/react-native/ReactCommon"
  pod 'ReactCommon/turbomodule/core', :path => "../node_modules/react-native/ReactCommon"
  pod 'Yoga', :path => '../node_modules/react-native/ReactCommon/yoga', :modular_headers => true

  pod 'DoubleConversion', :podspec => '../node_modules/react-native/third-party-podspecs/DoubleConversion.podspec'
  pod 'glog', :podspec => '../node_modules/react-native/third-party-podspecs/glog.podspec'
  pod 'Folly', :podspec => '../node_modules/react-native/third-party-podspecs/Folly.podspec'

  pod 'RNGestureHandler', :path => '../node_modules/react-native-gesture-handler'

  target 'LocalMainStreetTests' do
    inherit! :complete
    # Pods for testing
  end

  use_native_modules!

  # Enables Flipper.
  #
  # Note that if you have use_frameworks! enabled, Flipper will not work and
  # you should disable these next few lines.
  add_flipper_pods!
  post_install do |installer|
    flipper_post_install(installer)
  end
end

target 'LocalMainStreet-tvOS' do
  # Pods for LocalMainStreet-tvOS

  target 'LocalMainStreet-tvOSTests' do
    inherit! :search_paths
    # Pods for testing
  end
end

Please help. Thanks.

Upvotes: 57

Views: 79085

Answers (19)

Siempay
Siempay

Reputation: 1002

Solution is in the link: https://www.npmjs.com/package/react-native-permissions

Install the react-native-permissions Package:

Ensure that the react-native-permissions package is installed in your project:

yarn add react-native-permissions

Configure Your Podfile for iOS:

# At the top of your Podfile
def node_require(script)
  # Resolve script with node to allow for hoisting
  require Pod::Executable.execute_command('node', ['-p',
    "require.resolve(
      '#{script}',
      {paths: [process.argv[1]]},
    )", __dir__]).strip
end

# Use it to require both react-native's and this package's scripts:
node_require('react-native/scripts/react_native_pods.rb')
node_require('react-native-permissions/scripts/setup.rb')

# Inside your target block
target 'YourApp' do
  # Other configurations...

  # Specify the permissions you need
  setup_permissions([
    'LocationWhenInUse', # Add other permissions as needed
  ])

  # Other configurations...
end

Add Usage Descriptions to Info.plist:

<key>NSLocationWhenInUseUsageDescription</key>
<string>We need your location to show nearby places.</string>
<key>NSLocationAlwaysUsageDescription</key>
<string>We need your location to improve your experience.</string>
<key>NSLocationAlwaysAndWhenInUseUsageDescription</key>
<string>We need your location to find places even in the background.</string>

Upvotes: 0

Mayur Vaghasiya
Mayur Vaghasiya

Reputation: 1482

I am facing same issue in react-native-0.72.0

Resolve steps

Step 1 : Install "react-native-permissions": "3.0.4" version

Step 2 : Add the code below in your pod file inside target 'Your app name' do section

permissions_path = '../node_modules/react-native-permissions/ios'
pod 'Permission-Camera', :path => "#{permissions_path}/Camera"

If the code below exists in your package.json, just delete it. No need for extra configuration!

"resolutions": {
    "react-native-permissions": "^3.8.4"
},
  
"overrides": {
   "react-native-qrcode-scanner": {
   "react-native-permissions": "^3.8.4"
}

Upvotes: 1

Talha
Talha

Reputation: 886

I also have same issue I got the solution.

you just need to update that package. Previously i'm using 3.2.0 version of that package and I continuously face that issue.

with the help of @Developerusman I resolve this issue while updating Package to "react-native-permissions": "^3.10.1",

also you can check this out GitHub Issues

First thing you have to paste this code in podfile:

permissions_path = '../node_modules/react-native-permissions/ios'
pod 'Permission-LocationAlways', :path => "#{permissions_path}/LocationAlways/Permission-LocationAlways.podspec"
pod 'Permission-LocationWhenInUse', :path => "#{permissions_path}/LocationWhenInUse/Permission-LocationWhenInUse.podspec"
pod 'Permission-Camera', :path => "#{permissions_path}/Camera"
pod 'Permission-Contacts', :path => "#{permissions_path}/Contacts"
pod 'Permission-LocationAccuracy', :path => "#{permissions_path}/LocationAccuracy"
pod 'Permission-MediaLibrary', :path => "#{permissions_path}/MediaLibrary"
pod 'Permission-Notifications', :path => "#{permissions_path}/Notifications"
pod 'Permission-PhotoLibraryAddOnly', :path => "#{permissions_path}/PhotoLibraryAddOnly"

I hope It can help you.

Upvotes: 1

Adarsh D
Adarsh D

Reputation: 139

Instead of configuring each Pod file,

Install react-native-permissions by running a command

npm i react-native-permissions

or

yarn add react-native-permissions

This will install the react-native-permissions package. Then in ios/Podfile

use_react_native!(
)

##....

pod 'RNPermissions', :path => '../node_modules/react-native-permissions'

##....

This will add the required Pods to the iOS project.

Then run

cd ios
pod install

Upvotes: 3

Muzammil Hasnain
Muzammil Hasnain

Reputation: 149

at very first do close your simulator then run npx react-native setup-ios-permissions then cd ios then pod install then cd .. and run your project npx react-native run-ios

Upvotes: 2

Muhammad Ameen
Muhammad Ameen

Reputation: 165

I add the geolocation service and update the info.plist file after that, I have to get the same problem that you mentioned in the image

Steps that I have followed through the react-native-permission document that's work for me

I add this code to the package.json file. In the reactNativePermissionsIOS object, you can add those things you want to access mentioned in the document

"reactNativePermissionsIOS": [
    "Camera",
    "PhotoLibrary",
    "LocationWhenInUse"
  ],

and then add in info.plist that you want to access

<key>NSPhotoLibraryUsageDescription</key>
    <string>Talemi marakiz needs to access the image gallery</string>
    <key>NSCameraUsageDescription</key>
    <string>Talemi marakiz need to access camera</string>
    <key>NSLocationWhenInUseUsageDescription</key>
    <string>Talemi marakiz needs to access your location</string>

I read the react-native-permission document for ios React Native Permission for ios

In the documentation, you need something to be noted. after setup all the things you must need to run this npx react-native setup-ios-permissions in your terminal

I set up all those things but forgot to run this specific code so I get an error. In my case after run this npx react-native setup-ios-permissions error resolve

Upvotes: 0

Justice Mba
Justice Mba

Reputation: 101

May 2023

Upgrading to the latest React Native version (0.71.8) fixed this for me.

Upvotes: 0

I was facing this issue and realized that regardless all configurations I was missing to "setup" the permissions.

Based on that, if you have done everything mentioned on other answers and it still didn't work, make sure you ran npx react-native setup-ios-permissions followed by pod install.

Upvotes: 2

Dragos UniqQum
Dragos UniqQum

Reputation: 695

If you are using use_frameworks! (for example for firebase app)

add the following to convert all permission pods into static libraries, according to the docs.

pre_install do |installer|
  Pod::Installer::Xcode::TargetValidator.send(:define_method, :verify_no_static_framework_transitive_dependencies) {}

  installer.pod_targets.each do |pod|
    if pod.name.eql?('RNPermissions') || pod.name.start_with?('Permission-')
      def pod.build_type;
        Pod::BuildType.static_library
      end
    end
  end
end

Add necessary permissions for your app after use_react_native!(...):

use_react_native!(
    :path => config[:reactNativePath],
    :hermes_enabled => false,
    :fabric_enabled => flags[:fabric_enabled],
  )

  permissions_path = '../node_modules/react-native-permissions/ios'
  pod 'Permission-LocationAccuracy', :path => "#{permissions_path}/LocationAccuracy"
  pod 'Permission-LocationWhenInUse', :path => "#{permissions_path}/LocationWhenInUse"

Clean your project in XCode => Product => Clean Project Clean Derived data:

rm -rf ~/Library/Developer/Xcode/DerivedData

Note: Close the IOS Simulator

Also you can go to ios folder and delete Podfile.lock and Pods folder.

Install the pods: npx pod-install or cd ios && pod install

Try to run your app.

yarn ios or npm run ios

Upvotes: 16

Olamigoke Philip
Olamigoke Philip

Reputation: 1157

In addition to @Vaibhav Herugu's answer::

  • Ensure the react-native-permissions package is installed. For Podfile tweaks? follow the instruction guide here:: https://www.npmjs.com/package/react-native-permissions

  • Uninstall the app on your device

  • You can delete the Xcode DerivedData folder directly from the terminal: rm -rf ~/Library/Developer/Xcode/DerivedData

  • Rebuild your app and smile :) (Hopefully)

Upvotes: 1

donkey
donkey

Reputation: 542

In my case, delete the build folder and rebuild then everything is go success.

Upvotes: 0

Anderson Santos
Anderson Santos

Reputation: 41

The path changed. Now its ok. See below:

# permissions 
  pod 'Permission-BluetoothPeripheral', :path => "#{permissions_path}/BluetoothPeripheral/Permission-BluetoothPeripheral.podspec"
  pod 'Permission-Calendars', :path => "#{permissions_path}/Calendars/Permission-Calendars.podspec"
  pod 'Permission-Camera', :path => "#{permissions_path}/Camera/Permission-Camera.podspec"
  pod 'Permission-Contacts', :path => "#{permissions_path}/Contacts/Permission-Contacts.podspec"
  pod 'Permission-FaceID', :path => "#{permissions_path}/FaceID/Permission-FaceID.podspec"
  pod 'Permission-LocationAlways', :path => "#{permissions_path}/LocationAlways/Permission-LocationAlways.podspec"
  pod 'Permission-LocationWhenInUse', :path => "#{permissions_path}/LocationWhenInUse/Permission-LocationWhenInUse.podspec"
  pod 'Permission-MediaLibrary', :path => "#{permissions_path}/MediaLibrary/Permission-MediaLibrary.podspec"
  pod 'Permission-Microphone', :path => "#{permissions_path}/Microphone/Permission-Microphone.podspec"
  pod 'Permission-Motion', :path => "#{permissions_path}/Motion/Permission-Motion.podspec"
  pod 'Permission-Notifications', :path => "#{permissions_path}/Notifications/Permission-Notifications.podspec"
  pod 'Permission-PhotoLibrary', :path => "#{permissions_path}/PhotoLibrary/Permission-PhotoLibrary.podspec"
  pod 'Permission-Reminders', :path => "#{permissions_path}/Reminders/Permission-Reminders.podspec"
  pod 'Permission-Siri', :path => "#{permissions_path}/Siri/Permission-Siri.podspec"

Upvotes: 4

Ali Akram
Ali Akram

Reputation: 5327

Added these in podFile

  permissions_path = '../node_modules/react-native-permissions/ios'
  pod 'Permission-LocationAlways', :path => "#{permissions_path}/LocationAlways/Permission-LocationAlways.podspec"
  pod 'Permission-LocationWhenInUse', :path => "#{permissions_path}/LocationWhenInUse/Permission-LocationWhenInUse.podspec"

Then run pod install For me this worked.

Upvotes: 18

Muhammad Numan
Muhammad Numan

Reputation: 25423

iOS

By default no permission handler is installed. Update your Podfile by choosing the ones you want to check or request, then run pod install.

target 'YourAwesomeProject' do

  # …

  permissions_path = '../node_modules/react-native-permissions/ios'

  pod 'Permission-AppTrackingTransparency', :path => "#{permissions_path}/AppTrackingTransparency"
  pod 'Permission-BluetoothPeripheral', :path => "#{permissions_path}/BluetoothPeripheral"
  pod 'Permission-Calendars', :path => "#{permissions_path}/Calendars"
  pod 'Permission-Camera', :path => "#{permissions_path}/Camera"
  pod 'Permission-Contacts', :path => "#{permissions_path}/Contacts"
  pod 'Permission-FaceID', :path => "#{permissions_path}/FaceID"
  pod 'Permission-LocationAccuracy', :path => "#{permissions_path}/LocationAccuracy"
  pod 'Permission-LocationAlways', :path => "#{permissions_path}/LocationAlways"
  pod 'Permission-LocationWhenInUse', :path => "#{permissions_path}/LocationWhenInUse"
  pod 'Permission-MediaLibrary', :path => "#{permissions_path}/MediaLibrary"
  pod 'Permission-Microphone', :path => "#{permissions_path}/Microphone"
  pod 'Permission-Motion', :path => "#{permissions_path}/Motion"
  pod 'Permission-Notifications', :path => "#{permissions_path}/Notifications"
  pod 'Permission-PhotoLibrary', :path => "#{permissions_path}/PhotoLibrary"
  pod 'Permission-PhotoLibraryAddOnly', :path => "#{permissions_path}/PhotoLibraryAddOnly"
  pod 'Permission-Reminders', :path => "#{permissions_path}/Reminders"
  pod 'Permission-Siri', :path => "#{permissions_path}/Siri"
  pod 'Permission-SpeechRecognition', :path => "#{permissions_path}/SpeechRecognition"
  pod 'Permission-StoreKit', :path => "#{permissions_path}/StoreKit"

end

Upvotes: 4

arp
arp

Reputation: 371

They have mentioned about this issue in the documentation and also suggested a fix for the same and it works. Clearing the Xcode cache worked for me :)

Solution:

If you see a No permission handler detected error: Make sure that you have at least one permission handler set up. In some cases the Xcode cache needs to be cleared (Xcode -> Product -> Clean Build Folder)

Upvotes: 5

XplosiVe06
XplosiVe06

Reputation: 646

I had the same issue because I forgot to do:

npx pod-install
//or
cd ios
pod-install

Upvotes: 1

Brian Li
Brian Li

Reputation: 3110

At the moment, your Podfile is not configured to handle permissions. In your Podfile under your target, add the relevant lines of code for the permissions you are requesting:

target 'LocalMainStreet' do

  # react-native-permissions permission handlers
  permissions_path = '../node_modules/react-native-permissions/ios'

  pod 'Permission-AppTrackingTransparency', :path => "#{permissions_path}/AppTrackingTransparency.podspec"
  pod 'Permission-BluetoothPeripheral', :path => "#{permissions_path}/BluetoothPeripheral.podspec"
  pod 'Permission-Calendars', :path => "#{permissions_path}/Calendars.podspec"
  pod 'Permission-Camera', :path => "#{permissions_path}/Camera.podspec"
  pod 'Permission-Contacts', :path => "#{permissions_path}/Contacts.podspec"
  pod 'Permission-FaceID', :path => "#{permissions_path}/FaceID.podspec"
  pod 'Permission-LocationAlways', :path => "#{permissions_path}/LocationAlways.podspec"
  pod 'Permission-LocationWhenInUse', :path => "#{permissions_path}/LocationWhenInUse.podspec"
  pod 'Permission-MediaLibrary', :path => "#{permissions_path}/MediaLibrary.podspec"
  pod 'Permission-Microphone', :path => "#{permissions_path}/Microphone.podspec"
  pod 'Permission-Motion', :path => "#{permissions_path}/Motion.podspec"
  pod 'Permission-Notifications', :path => "#{permissions_path}/Notifications.podspec"
  pod 'Permission-PhotoLibrary', :path => "#{permissions_path}/PhotoLibrary.podspec"
  pod 'Permission-Reminders', :path => "#{permissions_path}/Reminders.podspec"
  pod 'Permission-Siri', :path => "#{permissions_path}/Siri.podspec"
  pod 'Permission-SpeechRecognition', :path => "#{permissions_path}/SpeechRecognition.podspec"
  pod 'Permission-StoreKit', :path => "#{permissions_path}/StoreKit.podspec"

end

You can read more about it in the react-native-permissions repo.

Upvotes: 4

Jorciney
Jorciney

Reputation: 740

I was having the same issue with React Native 0.63.2.

The Solution was

1 - to update my cocopods version with

sudo gem install cocoapods --pre

2 - remove the following code from my pod file

pre_install do |installer|
  installer.pod_targets.each do |pod|
    if pod.name.eql?('RNPermissions') || pod.name.start_with?('Permission-')
      def pod.build_type;
        # Uncomment one line depending on your CocoaPods version
        Pod::BuildType.static_library # >= 1.9
        #Pod::Target::BuildType.static_library # < 1.9
      end
    end
  end
end

After that, I did a pod install and everything was working again.

Upvotes: 0

Vaibhav Herugu
Vaibhav Herugu

Reputation: 1102

You just have to install RN Permissions and make changes to the podfile and info.plist. Depending on what you need the permissions for, you get the pods. If you're not sure, do them all. You can find the code at https://www.npmjs.com/package/react-native-permissions. There are also some other things you may have to do-those I didn't talk about but are in the npm documentation in the link.

Thanks to @Raghav Herugu for helping me solve the problem

Upvotes: 21

Related Questions