指南
如何在 Capacitor 中使用 Photo Library
使用 @capgo/capacitor-photo-library
Capacitor 插件可以将照片库展示为网页，而非无法修改且无需授权的枯燥原生界面。
安装
bun add @capgo/capacitor-photo-library
bunx cap sync
bunx cap sync 将插件的原生 code 复制到你的原生项目中。每次升级插件后都要重新运行。
导入
import { PhotoLibrary } from '@capgo/capacitor-photo-library';
API 概览
| 方法 | 描述 |
|---|---|
checkAuthorization |
在不弹出提示的情况下，返回当前的授权状态。 |
requestAuthorization |
根据需要请求访问相册的权限。 |
getAlbums |
获取所有可用的相册。 |
getLibrary |
获取相册资源及其可在 Web View 中显示的 URL。 |
getPhotoUrl |
获取资源全分辨率版本的可显示 URL。如果你已经调用了 getLibrary 配合 includeFullResolutionData，通常不需要再调用此方法。 |
getThumbnailUrl |
获取该资源缩放后缩略图的可显示 URL。 |
pickMedia |
打开原生系统选择器，让用户无需授予完整的相册访问权限即可选择媒体文件。所选文件将被复制到应用缓存中，并以可移植 URL 的形式返回。 |
示例
checkAuthorization()
在不弹出提示的情况下，返回当前的授权状态。
import { PhotoLibrary } from '@capgo/capacitor-photo-library';
const result = await PhotoLibrary.checkAuthorization();
console.log(result);
requestAuthorization()
根据需要请求访问相册的权限。
import { PhotoLibrary } from '@capgo/capacitor-photo-library';
const result = await PhotoLibrary.requestAuthorization();
console.log(result);
getAlbums()
获取所有可用的相册。
import { PhotoLibrary } from '@capgo/capacitor-photo-library';
const result = await PhotoLibrary.getAlbums();
console.log(result);
getLibrary()
获取相册资源及其可在 Web View 中显示的 URL。
import { PhotoLibrary } from '@capgo/capacitor-photo-library';
const result = await PhotoLibrary.getLibrary();
console.log(result);
getPhotoUrl()
获取资源全分辨率版本的可显示 URL。如果你已经调用了 getLibrary 配合 includeFullResolutionData，通常不需要再调用此方法。
import { PhotoLibrary } from '@capgo/capacitor-photo-library';
const result = await PhotoLibrary.getPhotoUrl({ id: 'id-123' });
console.log(result);
getThumbnailUrl()
获取该资源缩放后缩略图的可显示 URL。
import { PhotoLibrary } from '@capgo/capacitor-photo-library';
const result = await PhotoLibrary.getThumbnailUrl({ id: 'id-123' });
console.log(result);
上表列出了 7 个核心方法。监听器、版本辅助函数以及每个方法的完整契约，请参阅 GitHub 仓库.
完整参考文档
继续了解使用 @capgo/capacitor-photo-library
如果你正在使用 使用 @capgo/capacitor-photo-library 来规划原生媒体和界面行为，并将其与 @capgo/capacitor-photo-library 了解 @capgo/capacitor-photo-library 中的实现细节， 快速入门 有关“入门指南”中的实现细节， 使用 @capgo/capacitor-live-activities 用于使用 @capgo/capacitor-live-activities 时的原生能力， @capgo/capacitor-live-activities 关于 @capgo/capacitor-live-activities 中的实现细节，以及 使用 @capgo/capacitor-video-player 有关“使用 @capgo/capacitor-video-player.”中的原生能力