월: 2023 6월

React native 에서 사용되는 FormData 는 form-data 모듈과는 뭔가 다른지, multipart로 전송할 경우에 각 파트의 content-type 을 지정할 수 없어서 애를 먹었다. (디폴트 application/octect-stream 으로 설정됨)

이미지는 uri 프로퍼티에 파일경로를 type 프로퍼티에 타입을 지정해서 객체로 넘기면 된다는 거까지는 쉽게 알아냈는데, JSON은 도통 방법을 찾을 수가 없다.

거의 포기할려던 찰나… string 프로퍼티에 JSON을 문자열로 변환하여 넘기면 된다는 내용을 발견! 해결되었다.

import axios from "axios";

exprot const submitMultipart = (body: any) => {
  const formData = new FormData();

  formData.append("jsonData", {"string": JSON.stringfy(body.jsonData, type: "application/json"});
  formData.appand("image", {uri: body.imageUri, type: "image/jpeg"});

  const instance = axios.create();
  return await instance({
    url: "/post-data",
    method: "post",
    data: formData,
    headers: {
      "content-type: "multipart/form-data"
    }
  });
}

참고 : https://stackoverflow.com/questions/32441963/how-to-use-formdata-in-react-native