Passer au contenu
Capgo

Getting Started

Ce contenu n'est pas encore disponible dans votre langue.

  1. Install the plugin

    Fenêtre de terminal
    npm i @capgo/capacitor-photo-library

  2. Sync platforms

    Fenêtre de terminal
    npx cap sync

Platform permissions

Section titled “Platform permissions”
  • iOS: Update Info.plist with NSPhotoLibraryUsageDescription (and NSPhotoLibraryAddUsageDescription if you plan to save media).
  • Android: For Android 13+, declare the photo/video permissions (READ_MEDIA_IMAGES, READ_MEDIA_VIDEO). Capacitor 5 handles this automatically, but double-check custom manifests.

Request access

Section titled “Request access”
import { PhotoLibrary } from '@capgo/capacitor-photo-library';


const { state } = await PhotoLibrary.requestAuthorization();
if (state !== 'authorized' && state !== 'limited') {
  throw new Error('Photo access denied');
}
Section titled “Load the gallery”
import { Capacitor } from '@capacitor/core';


const { assets, hasMore, nextPage } = await PhotoLibrary.getLibrary({
  limit: 100,
  includeAlbums: false,
  thumbnailWidth: 256,
  thumbnailHeight: 256,
});


const gallery = assets.map((asset) => ({
  id: asset.id,
  fileName: asset.fileName,
  created: asset.creationDate,
  thumbnailUrl: asset.thumbnail
    ? asset.thumbnail.webPath ?? Capacitor.convertFileSrc(asset.thumbnail.path)
    : undefined,
  photoUrl: asset.file
    ? asset.file.webPath ?? Capacitor.convertFileSrc(asset.file.path)
    : undefined,
}));

To fetch additional pages, call PhotoLibrary.getLibrary({ cursor: nextPage }).

Let users pick media

Section titled “Let users pick media”
const selection = await PhotoLibrary.pickMedia({
  selectionLimit: 5,
  includeVideos: true,
});


console.log('User selected', selection.assets.length, 'items');

Clean up cached files

Section titled “Clean up cached files”

Generated thumbnails and exports are stored in the app cache directory under photoLibrary. Remove them with your preferred file API when you need to reclaim storage.