이전글에서 image-picker 라이브러리를 사용하여 사용자 앨범에 접근하는 방법에 대해 정리하였다. 이제 image file을 form-data 처리해주어 HTTP(axios | fetch)으로 서버에 전송해야 한다. 처음엔 axios를 사용하였는데 Network Error(Failed to connect)부터 서버쪽에 res.body undefined 까지 여러가지 문제가 발생했다. 1.Formdata 처리 image등의 파일을 HTTP 통신으로 전송할때는 반드시 formdata처리를 해주어야 한다. const UploadImage = async() => { const image = { uri: '', type: '', name: '', }; await launchImageLibrary({}, (r..

리액트 네이티브 앱 프로젝트를 진행하면서 image-picker를 이용한 사진 업로드를 구현한 과정을 기록하고자 한다. 개발 환경은 아래 이미지로 요약하고자 한다. 본 글에서는 image-picker를 사용한 사진 업로드가 주된 내용이므로 AWS 백앤드 구축 관련한 내용은 생략한다. image-picker로 사용자 앨범에서 선택한 사진을 S3로 업로드 하는 로직을 간단하게 요약하자면 아래와 같다. 1.client : image-picker의 launchImageLibrary메소드를 통해 사용자 앨범에 접근하여 사진을 선택하고 객체를 반환한다. 2.반환 받은 객체를 HTTP 통신으로 서버에 전송하기 위해 Formdata 처리를 해준다. 3.fetch를 사용하여 API 서버에 formdata를 post re..