Ionic获取手机相册全部图片：PhotoLibrary插件失效的替代方案

原本计划使用@awesome-cordova-plugins/photo-library插件获取手机相册中的所有图片，但该插件已停止维护，且持续提示无权限。需求是无需弹出选择界面直接获取全部图片，不使用Camera插件的用户选择模式。

原实现代码 #

import { PhotoLibrary } from '@awesome-cordova-plugins/photo-library/ngx';

this.photoLibrary.requestAuthorization({read:true,write:true}).then(() => {
  this.photoLibrary.getLibrary().subscribe({
    next: library => {
      library.forEach(function(libraryItem) {
        console.log(libraryItem.id);          // 图片ID
        console.log(libraryItem.photoURL);    // 跨平台图片访问地址
        console.log(libraryItem.thumbnailURL);// 跨平台缩略图访问地址
        console.log(libraryItem.fileName);
        console.log(libraryItem.width);
        console.log(libraryItem.height);
        console.log(libraryItem.creationDate);
        console.log(libraryItem.latitude);
        console.log(libraryItem.longitude);
        console.log(libraryItem.albumIds);    // 对应相册ID数组，仅在使用includeAlbumsData时返回
      });
    },
    error: err => { console.log('无法获取图片'); },
    complete: () => { console.log('图片获取完成'); }
  });
})
.catch(err => console.log('未获取到权限'));

Ionic环境信息 #

Ionic:
   Ionic CLI                     : 5.4.16 (/Users/pedrojung/.nvm/versions/node/v14.17.3/lib/node_modules/ionic)
   Ionic Framework               : @ionic/angular 6.3.6
   @angular-devkit/build-angular : 14.2.9
   @angular-devkit/schematics    : 14.2.9
   @angular/cli                  : 14.2.9
   @ionic/angular-toolkit        : 6.1.0

Cordova:

   Cordova CLI       : 11.0.0
   Cordova Platforms : android 11.0.0
   Cordova Plugins   : cordova-plugin-ionic-keyboard 2.2.0, cordova-plugin-ionic-webview 5.0.0, (and 5 other plugins)

Utility:

   cordova-res : 0.15.4
   native-run  : 1.7.1

System:

   Android SDK Tools : 26.1.1 (/Users/pedrojung/Library/Android/sdk)
   ios-deploy        : 1.11.4
   NodeJS            : v14.17.3 (/Users/pedrojung/.nvm/versions/node/v14.17.3/bin/node)
   npm               : 6.14.13
   OS                : macOS Ventura
   Xcode             : Xcode 14.1 Build version 14B47b

由于@awesome-cordova-plugins/photo-library已停止维护，推荐以下两种可行方案：

方案一：使用维护版插件cordova-plugin-media-library #

这是原photo-library插件的官方维护分支，修复了权限和兼容性问题：

1. 卸载旧插件：

ionic cordova plugin remove cordova-plugin-photo-library
npm uninstall @awesome-cordova-plugins/photo-library

2. 安装维护版插件：

ionic cordova plugin add cordova-plugin-media-library
npm install @awesome-cordova-plugins/media-library

3. 修改代码适配新插件：

import { MediaLibrary } from '@awesome-cordova-plugins/media-library/ngx';

constructor(private mediaLibrary: MediaLibrary) {}

async loadAllPhotos() {
  try {
    // 仅请求读取权限（无需写入权限可省略）
    await this.mediaLibrary.requestPermission('read');
    // 获取所有图片媒体项
    const mediaItems = await this.mediaLibrary.getFiles('image', {});
    
    mediaItems.forEach(item => {
      console.log('图片ID:', item.id);
      console.log('图片本地地址:', item.localURL);
      console.log('缩略图地址:', item.thumbnailURL);
      console.log('文件名:', item.name);
      // 按需获取其他字段：创建时间、尺寸等
    });
  } catch (err) {
    console.error('权限失败或加载错误:', err);
  }
}

4. 配置平台权限：
   • Android：在AndroidManifest.xml中添加：

     <!-- Android 13+ 权限 -->
     <uses-permission android:name="android.permission.READ_MEDIA_IMAGES" />
     <!-- Android 10及以下兼容 -->
     <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" android:maxSdkVersion="29" />
     

   • iOS：在Info.plist中添加权限描述：

     <key>NSPhotoLibraryUsageDescription</key>
     <string>需要访问您的相册以获取图片</string>
     

方案二：原生API适配（自定义场景） #

如果插件仍无法满足需求，可结合Capacitor Filesystem插件+原生权限处理：

1. 安装Capacitor Filesystem：

npm install @capacitor/filesystem
npx cap sync

2. 权限配置同方案一
3. 注意事项：Android 11+需使用MediaStore API，iOS需使用PhotoKit，这部分需要编写原生桥接代码，适合需要高度自定义的场景，优先推荐方案一减少开发成本。

核心注意点 #

• Android 13+必须申请READ_MEDIA_IMAGES，旧的READ_EXTERNAL_STORAGE已失效
• iOS权限描述必须明确，否则App Store审核会被驳回
• 避免一次性加载全部图片，建议分页获取，防止内存溢出

内容的提问来源于stack exchange，提问作者john.P