[NestJS] 여러개의 파일 보내고 받기

aqualung·2024년 7월 5일
  • 프론트엔드
const formData = new FormData();

// 배열을 보낼때
examples.map((example) => formData.append("example[]", example);
// 파일 배열을 보낼때
files.map((file) => formData.append("image", file);
  • 백엔드 - NestJS
@UseInterceptors(FilesInterceptor('image')) // 받을 때도 똑같이 뒤에 []를 붙이지 않는다
@Post()
async postExample(
  @UploadedFiles() files: Express.Multer.File[],
  @Body() data
) {
  data.example.map((e) => console.log(e));
}

배열을 form-data에 담을 때는 위 코드처럼 FormData.append()의 첫번째 파라미터 뒤에 []를 붙여준다.

하지만 NestJS에서 여러 개의 파일을 받을 때는 FilesInterceptor를 사용한다. 이 때 JavaScript FormData.append() 메소드를 사용할 때는 첫번째 파라미터에[] 대괄호를 사용하지 않고 넘겨줘야 한다. (form-data는 중복된 필드를 허용한다.)

물론 []를 뒤에 붙이고 nestjs인터셉터에서 받을 때 FilesInterceptor("images[]") 라는 식으로 받으면 정상적으로 작동하지만 이는 자연스러운 용법은 아니라고 생각했다.

0개의 댓글