본문 바로가기

Frontend

FormData 형식으로 multipart 데이터 PUT 요청하기

개요

프로젝트를 진행하면서 브라우저에서 엑셀 파일을 업로드하고 수정한 엑셀 파일 및 데이터를 BE로 보내는 과정에서

JSON 형식이 아닌 formData 형식으로 보내야했다.

 

코드

multipart PUT

- formData 객체를 생성 후 append를 사용하여 key, value를 추가해준다.

- formData 객체를 console.log 호출 시 `{}`만 출력된다.

- `for ... of` 문으로 출력해야 console 창에서 확인이 가능하다.

- multipart 형식으로 보내야하는 File은 input 창에 업로드되거나 drop 된 원본 파일을 그대로 보내줘야 한다. 위 코드에서는 Jotai 상태값으로 관리해주었다.