Skip to content

fetchAlbumPhotos

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

시그니처

typescript
function fetchAlbumPhotos(options: FetchAlbumPhotosOptions): Promise<ImageResponse[]>;

파라미터

  • options필수

    조회 옵션을 담은 객체예요.

    • options.maxCountnumber · 10

      가져올 사진의 최대 개수를 설정해요. 숫자로 입력하며 기본값은 10이에요.

    • options.maxWidthnumber · 1024

      사진의 최대 폭을 제한해요. 단위는 픽셀이며 기본값은 1024이에요.

    • options.base64boolean · false

      이미지를 base64 형식으로 반환할지 설정해요. 기본값은 false예요.

반환 값

  • Promise<ImageResponse[]>

앨범 사진의 고유 ID와 데이터 URI를 포함한 배열을 반환해요.

예제

사진의 최대 폭을 360px로 제한하여 가져오기

tsx
import React, { useState } from 'react';
import { View, Image, Button } from 'react-native';
import { fetchAlbumPhotos } from '@apps-in-toss/framework';

const base64 = true;

// 앨범 사진 목록을 가져와 화면에 표시하는 컴포넌트
function AlbumPhotoList() {
  const [albumPhotos, setAlbumPhotos] = useState([]);

  const handlePress = async () => {
    try {
      const response = await fetchAlbumPhotos({
        base64,
        maxWidth: 360,
      });
      setAlbumPhotos((prev) => ([...prev, ...response]));
    } catch (error) {
      console.error('앨범을 가져오는 데 실패했어요:', error);
    }
  };

  return (
    <View>
      {albumPhotos.map((image) => {
        // base64 형식으로 반환된 이미지를 표시하려면 데이터 URL 스키마 Prefix를 붙여야해요.
        const imageUri = base64 ? 'data:image/jpeg;base64,' + image.dataUri : image.dataUri;

        return <Image source={{ uri: imageUri }} key={image.id} />;
      })}
      <Button title="앨범 가져오기" onPress={handlePress} />
    </View>
  );
}