DavidY
DavidY

Reputation: 51

Expo expo-image-picker User rejected permissions despite having permissions acceptes

I am facing this issue in Expo SDK 46 with expo-image-picker 13.3.1.

Even when I request the camera permissions, and these permissions are granted, when I use ImagePicker.launchCameraAsync() it throws me an error "User rejected permissions". const result = await ImagePicker.launchCameraAsync({ mediaTypes: ImagePicker.MediaTypeOptions.Images, allowsEditing: false, base64: false, });

I upgraded and downgraded the library but I cant fix this issue.

Upvotes: 0

Views: 1180

Answers (2)

Jonas
Jonas

Reputation: 27

Try to use something like this. If the user denied the first time, he will be navigated to the settings to change the permission.

const permissionHandler = async () => {
  if (permission) {
   if (permission.status === PermissionStatus.DENIED) {
     await Linking.openSettings();
   } else if (permission.status === PermissionStatus.UNDETERMINED) {
     await requestPermission();
    }
   }
 };

Upvotes: 0

Michael Bahl
Michael Bahl

Reputation: 3649

Checkout my sample it works for me.

import { Camera, CameraType } from 'expo-camera';
import { useState } from 'react';
import { Button, StyleSheet, Text, TouchableOpacity, View } from 'react-native';
import * as ImagePicker from 'expo-image-picker';

const openCamera = async () => {
  const result = await ImagePicker.launchCameraAsync({
    mediaTypes: ImagePicker.MediaTypeOptions.Images,
    allowsEditing: false,
    base64: false,
    aspect: [4, 3],
    quality: 1,
  });

  console.log(result);
};

export default function App() {
  const [permission, requestPermission] = Camera.useCameraPermissions();
  if (!permission) {
    // Camera permissions are still loading
    return <View />;
  }

  if (!permission.granted) {
    // Camera permissions are not granted yet
    return (
      <View style={styles.container}>
        <Text style={{ textAlign: 'center' }}>
          We need your permission to show the camera
        </Text>
        <Button onPress={requestPermission} title="grant permission" />
      </View>
    );
  }

  return (
    <View style={styles.container}>
        <View style={styles.buttonContainer}>
          <TouchableOpacity style={styles.button} onPress={openCamera}>
            <Text style={styles.text}>Open Camera</Text>
          </TouchableOpacity>
        </View>
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
  },
  buttonContainer: {
    flex: 1,
    flexDirection: 'row',
    backgroundColor: 'transparent',
    margin: 64,
  },
  button: {
    flex: 1,
    alignSelf: 'flex-end',
    alignItems: 'center',
  },
  text: {
    fontSize: 24,
    fontWeight: 'bold',
    color: 'black',
  },
});

Upvotes: 0

Related Questions