Expo ImagePicker有限权限问题：iOS相册始终显示全部照片

问题原因 #

iOS系统自带的相册选择器（UIImagePickerController）在「Select Photos」权限模式下，会默认展示全部照片，但仅允许用户选择之前授权的内容——这是iOS的原生设计。如果要实现仅显示用户选中的照片，无法通过Expo ImagePicker的launchImageLibraryAsync直接达成，必须借助Expo MediaLibrary获取用户授权的资源并自定义相册选择界面。

解决步骤 #

1. 导入Expo MediaLibrary #

在UserName.js中添加MediaLibrary的导入：

import * as MediaLibrary from 'expo-media-library';

2. 修改权限判断与处理逻辑 #

更新showImagePicker函数，区分权限状态并分别处理：

const showImagePicker = async () => {
  const permissionResult = await ImagePicker.requestMediaLibraryPermissionsAsync();

  if (permissionResult.status === 'denied') {
    alert("你拒绝了应用访问相册的权限");
    return;
  }

  // 处理Limited权限：仅获取用户授权的照片，使用自定义选择器
  if (permissionResult.status === 'limited') {
    try {
      // 获取用户授权的照片资源
      const assets = await MediaLibrary.getAssetsAsync({
        mediaType: MediaLibrary.MediaType.photo,
        sortBy: [MediaLibrary.SortBy.modificationTime],
        ascending: false, // 按修改时间倒序
        first: 100 // 可根据需求调整加载数量
      });

      // 替换为你的自定义相册选择组件逻辑
      // 示例：将assets传入自定义组件，展示仅授权的照片
      alert(`已加载${assets.totalCount}张授权照片，请使用自定义相册选择器`);
    } catch (error) {
      console.error('获取授权照片失败:', error);
      alert('加载相册失败，请稍后重试');
    }
    return;
  }

  // 全权限模式：继续使用系统相册选择器
  const result = await ImagePicker.launchImageLibraryAsync({
    includeBase64: false,
    allowsEditing: true,
    aspect: [4, 3],
    quality: 0.5,
  });
  if (!result.cancelled) {
    setImage(result.uri);
  }
}

3. 配置Info.plist权限 #

在项目的app.json中添加MediaLibrary的权限描述：

{
  "expo": {
    "ios": {
      "infoPlist": {
        "NSPhotoLibraryUsageDescription": "需要访问你的相册来选择照片",
        "NSPhotoLibraryAddUsageDescription": "需要访问你的相册来保存照片"
      }
    }
  }
}

4. 实现自定义相册选择组件 #

创建自定义组件渲染授权照片缩略图，用户点击后获取照片URI并更新状态。简化示例：

// 自定义相册选择组件示例
const CustomPhotoPicker = ({ assets, onSelect, onClose }) => {
  return (
    <Modal isVisible={true} onBackdropPress={onClose}>
      <View style={{ flex: 1, padding: 20, backgroundColor: 'white' }}>
        <Text style={{ fontSize: 18, fontWeight: 'bold', marginBottom: 10 }}>
          已授权照片
        </Text>
        <ScrollView>
          <View style={{ flexDirection: 'row', flexWrap: 'wrap' }}>
            {assets.assets.map((asset, index) => (
              <Pressable
                key={index}
                style={{ width: '33%', padding: 2 }}
                async onPress={async () => {
                  const uri = await MediaLibrary.getAssetInfoAsync(asset.id).then(info => info.uri);
                  onSelect(uri);
                  onClose();
                }}
              >
                <Image
                  source={{ uri: asset.uri }}
                  style={{ width: '100%', aspectRatio: 1 }}
                />
              </Pressable>
            ))}
          </View>
        </ScrollView>
      </View>
    </Modal>
  );
};

关键说明 #

• 系统相册选择器无法在Limited权限下仅展示授权照片，这是iOS的原生限制，必须通过MediaLibrary获取资源并自定义UI。
• MediaLibrary的getAssetsAsync只会返回用户授权的照片，完全符合需求。

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