Device.getPhotos

함수형 API fetchAlbumPhotos로도 같은 기능을 쓸 수 있어요.

기능 설명

사용자의 앨범에서 사진 목록을 불러와요. 최대 개수와 해상도를 설정할 수 있고, 갤러리 미리보기·이미지 선택 등에 활용할 수 있어요.

사진첩 읽기 권한이 없으면 FetchAlbumPhotosPermissionError가 발생해요. Device.getPhotos.getPermission()으로 권한 상태를 확인하고, Device.getPhotos.openPermissionDialog()로 권한을 다시 요청할 수 있어요.

타입

Device.getPhotos(options?: FetchAlbumPhotosOptions): Promise<ImageResponse[]>;

Params

type FetchAlbumPhotosOptions = {
  /** 가져올 사진의 최대 개수예요. 기본값은 10이에요. */
  maxCount?: number;
  /** 사진의 최대 폭(px)이에요. 기본값은 1024이에요. */
  maxWidth?: number;
  /** 이미지를 base64로 반환할지 여부예요. 기본값은 false예요. */
  base64?: boolean;
};

Response

type ImageResponse = {
  id: string;
  dataUri: string;
};

에러

에러는 클래스로 던져져요 — error instanceof FetchAlbumPhotosPermissionError로 식별해요. 클래스는 @apps-in-toss/web-framework에서 import할 수 있어요.

에러 클래스	설명
FetchAlbumPhotosPermissionError	사진첩 읽기 권한이 거부된 경우예요. Device.getPhotos.openPermissionDialog()로 다시 요청할 수 있어요.

예시 코드

import {
  Device,
  FetchAlbumPhotosPermissionError,
} from "@apps-in-toss/web-framework";

const base64 = true;

async function renderAlbumPhotos() {
  try {
    const photos = await Device.getPhotos({
      base64,
      maxCount: 10,
      maxWidth: 360,
    });

    const container = document.getElementById("photo-list");
    for (const photo of photos) {
      const img = document.createElement("img");
      img.src = base64
        ? "data:image/jpeg;base64," + photo.dataUri
        : photo.dataUri;
      container.appendChild(img);
    }
  } catch (error) {
    if (error instanceof FetchAlbumPhotosPermissionError) {
      console.warn("사진첩 읽기 권한이 없어요.");
      return;
    }
    console.error(error);
  }
}

document
  .getElementById("load-photos")
  .addEventListener("click", renderAlbumPhotos);