[React Native] 갤러리에서 사진 가져오기 (iOS)

react-native: 0.61.5

 

갤러리에서 사진을 가져오려면 camera 권한이 필요함.

 

1) PHOTO_LIBRARY 권한 요청

 

https://coding-dahee.tistory.com/145

[React Native] react-native-permission 사용법

권한 요청 라이브러리 사용은 위 포스팅을 참고!

 

2) react-native-cameraroll 라이브러리 사용해서 사진을 가져와 보자.

https://github.com/react-native-community/react-native-cameraroll

react-native-community/react-native-cameraroll

rn community 문서는 굉장히 가독성이 좋다!!

 

- 설치

npm install @react-native-community/cameraroll --save

cd ios && pod install

설치는 이게 끝이다!!!!!

 

3) Usage

사진을 가져올 수 있는 getPhotos() API를 이용

  import CameraRoll from "@react-native-community/cameraroll";

  const getPhotos = async () => {
    try {
      const {edges} = await CameraRoll.getPhotos({
        first: 10,
      });
      console.log('📸', edges);

    } catch (error) {
      console.log('getPhoto', error);
    }
  };
  
  

first라는 옵션은 필수! 최신순으로 몇개의 사진을 가져올건지 정해야 한다.

 

- 콘솔은 이렇게 찍힌다.

아이폰 시뮬레이터 갤러리에 있는 기본 이미지들을 불러온다.

uri를 사용하고 싶으면

      const {edges} = await CameraRoll.getPhotos({
        first: 10,
      });
      
      const uri = edges[0].node.image.uri

이렇게 얻으면 된다!

 

 

====================

카메라 띄우기, 사진 찍기, 사진 저장하는 법도 궁금하시다면 아래 포스팅을 참고해주세요!

오늘 사용한 cameraroll을 이용하는 단계도 있습니다.

https://coding-dahee.tistory.com/147

[React Native] react-native-camera 카메라 띄우기, 사진 찍기, 사진 저장하는 법 (react-native-community)

 

 

 

Buy Me A Coffee!

https://www.buymeacoffee.com/daheeahn

daheeahn is app developer