File 업로드

 

Error : 415 Unsupported Media Type

 

• Vue 쪽에서 FormData로 board는 JSON 문자열, file은 파일로 보내고 있음
• Spring Boot에서는 @RequestPart를 써서 JSON과 파일을 각각 받으면 됨
• 415 오류는 Content-Type이 multipart/form-data가 아닌 application/json으로 들어오거나, 파라미터 매핑 방식이 맞지 않을 때 발생

 

formData.append('board', JSON.stringify(boardObj));
    if (file.value) {
      formData.append('file', file.value);
    }

아래와 같이 수정

formData.append('board', new Blob([JSON.stringify(boardObj)], { type: 'application/json' }));
    if (file.value) {
      formData.append('file', file.value);
    }

 

 

await axios.post('http://localhost:8080/board/save', formData, {
	headers: { 'Content-Type': 'multipart/form-data' }
});

 

@RequestPart("board") Board board,
@RequestPart(value="file", required=false) MultipartFile file

 

System.out.println("Board: " + board);
System.out.println("File: " + file.getOriginalFilename());
System.out.println("File: " + file.getContentType());
System.out.println("File: " + file.getSize());