IT박스

jQuery.ajax 및 FormData를 사용하여 파일을 업로드하는 방법

itboxs 2020. 12. 10. 19:43
반응형

jQuery.ajax 및 FormData를 사용하여 파일을 업로드하는 방법


XMLHttpRequest를 사용하면 FormData. 그러나로 전환하면 jQuery.ajax코드가 깨집니다.

이것은 작동하는 원본 코드입니다.

function uploadFile(blobFile, fileName) {
    var fd = new FormData();
    fd.append("fileToUpload", blobFile);
    var xhr = new XMLHttpRequest();
    xhr.open("POST", "upload.php", true);
    xhr.send(fd);
}

내 실패한 jQuery.ajax시도 는 다음과 같습니다 .

function uploadFile(blobFile, fileName) {
    var fd = new FormData();
    fd.append("fileToUpload", blobFile);
    var xm = $.ajax({
        url: "upload.php",
        type: "POST",
        data: fd,
    });
}

내가 도대체 ​​뭘 잘못하고있는 겁니까? AJAX를 사용하여 파일을 올바르게 업로드하려면 어떻게해야합니까?


processData:false,contentType:false메소드 에 추가 해야 jQuery가 헤더 나 데이터 (현재 코드를 깨는)를 변경하지 않도록합니다.

function uploadFile(blobFile, fileName) {
    var fd = new FormData();
    fd.append("fileToUpload", blobFile);

    $.ajax({
       url: "upload.php",
       type: "POST",
       data: fd,
       processData: false,
       contentType: false,
       success: function(response) {
           // .. do something
       },
       error: function(jqXHR, textStatus, errorMessage) {
           console.log(errorMessage); // Optional
       }
    });
}  

참고 URL : https://stackoverflow.com/questions/9622901/how-to-upload-a-file-using-jquery-ajax-and-formdata

반응형