使用create-react-native-app调用ImagePicker遇相机胶卷权限异常

我之前也碰到过类似的权限坑——明明权限状态显示已授予，但调用图片选择器还是报错，给你几个针对性的解决步骤：

1. 修正ImagePicker的参数错误 #

你代码里给height和width传了字符串'100px'，但launchImageLibraryAsync的这两个参数只接受数字类型的像素值，带单位的字符串会导致参数解析失败，可能间接触发权限相关的错误提示。

修正后的调用代码：

import { ImagePicker } from 'expo'; 

export const getImageFromLibrary = () => ({ 
  type: GET_IMAGE_FROM_LIBRARY, 
  promise: () => ImagePicker.launchImageLibraryAsync({ 
    height: 100, 
    width: 100, 
    base64: true 
  }) 
});

2. 确保app.json中配置了相机胶卷权限 #

Expo需要在项目的app.json文件中声明所需权限，否则即使代码里请求了权限，系统也可能不会正确授予。在expo字段下添加权限配置：

{
  "expo": {
    "permissions": ["CAMERA_ROLL"],
    // iOS必填权限描述（系统会展示给用户）
    "ios": {
      "infoPlist": {
        "NSPhotoLibraryUsageDescription": "需要访问您的相册以选择图片"
      }
    },
    // Android对应存储权限
    "android": {
      "permissions": ["READ_EXTERNAL_STORAGE", "WRITE_EXTERNAL_STORAGE"]
    }
  }
}

3. 改用Permissions.askAsync主动请求权限 #

你当前用的Permissions.getAsync只是获取当前权限状态，不会主动向用户发起权限请求。建议在调用ImagePicker之前，先主动请求权限，确保权限确实生效：

import { Permissions, ImagePicker } from 'expo';

// 封装带权限检查的图片选择函数
const pickImage = async () => {
  // 主动请求相机胶卷权限
  const { status } = await Permissions.askAsync(Permissions.CAMERA_ROLL);
  
  if (status === 'granted') {
    // 权限通过后调用图片选择器
    const result = await ImagePicker.launchImageLibraryAsync({
      height: 100,
      width: 100,
      base64: true
    });
    
    if (!result.cancelled) {
      console.log('选中的图片:', result);
      // 这里处理图片逻辑
    }
  } else {
    alert('需要授予相册权限才能选择图片');
  }
};

// 按钮调用这个函数
<Button onPress={pickImage}><Text>选择图片</Text></Button>

有时候系统的权限状态可能有缓存，主动调用askAsync可以刷新权限状态，确保实际权限和返回的状态一致。

额外排查点 #

• 如果你使用的是Expo SDK 44及以上版本，Permissions模块已经从核心包移到了独立包，需要先安装：expo install expo-permissions，然后导入：import * as Permissions from 'expo-permissions';
• 重启Expo开发服务器和模拟器/真机，权限配置变更往往需要重启才能生效。

内容的提问来源于stack exchange，提问作者X0r0N