반응형
ajax에서 API로 Multipart 파일을 보내려는 중 발생한 오류이다.
아래는 문제의 내 코드이다.
$.ajax({
url: '/api/exampleApi', // API 엔드포인트 URL
type: 'POST', // 요청 방식 (GET, POST 등)
data: formData, // 전송할 데이터
contentType: false, // 전송할 데이터 타입
dataType: false,
success: function(response) {
// 요청이 성공했을 때 실행할 코드
console.log('Success:', response);
},
error: function(jqXHR, textStatus, errorThrown) {
// 요청이 실패했을 때 실행할 코드
console.error('Error:', textStatus, errorThrown);
}
});
무엇이 잘못됐을까?
<ProcessData>
AJAX 통신에서 일반적으로 서버에 전달되는 데이터는 query string 형태이다.
ex) http://example.com?name=lee&no=1
data 파라미터로 전달된 데이터를 jQuery 내부적으로 query string 형태로 만드는 데, 파일 전송의 경우 불가능하므로 processData를 false 로 설정해야한다.
<ContentType>
보내는 데이터의 타입을 의미한다. 기본값은 application/x-www-form-urlencoded 이고, 흔히는 application/json; charset-utf-8 이 쓰인다. 기본 타입으로는 파일이 전송 안되기 때문에 false 로 설정해야한다.
아래는 수정된 내 코드이다.
$.ajax({
url: '/api/exampleApi',
type: 'POST',
data: formData,
contentType: false,
dataType: false,
processData: false, // 이 부분 추가됨!!!!!!
success: function(response) {
console.log('Success:', response);
},
error: function(jqXHR, textStatus, errorThrown) {
console.error('Error:', textStatus, errorThrown);
}
});
반응형