jquery agax FormData()를 여러 파일과 함께 사용하면서 다중 파트/폼 데이터 요청에 대한 경계를 설정하는 방법

jquery agax FormData()를 여러 파일과 함께 사용하면서 다중 파트/폼 데이터 요청에 대한 경계를 설정하는 방법

저는 한 번의 요청으로 기존 REST API에 3개의 파트를 업로드해야 하는 HTML 양식을 가지고 있습니다.FormData 제출에서 경계를 설정하는 방법에 대한 문서를 찾을 수 없습니다.

여기에 제시된 예를 따르려고 시도했습니다.jQuery에서 Ajax-requests로 FormData 개체를 보내는 방법은 무엇입니까?

그러나 데이터를 제출하면 다음 스택 추적과 함께 거부됩니다.

Caused by: org.apache.commons.fileupload.FileUploadException: the request was rejected because no multipart boundary was found.

경계를 설정하려면 어떻게 해야 합니까?

HTML/Javascript는 다음과 같습니다.

   <script type="text/javascript">
    function handleSubmit() {


        var jsonString = "{" +
                "\"userId\":\"" + document.formSubmit.userId.value + "\"" +
                ",\"locale\":\"" + document.formSubmit.locale.value + "\"" +
                "}";

        var data = new FormData();
        data.append('Json',jsonString);
        data.append('frontImage', document.formSubmit.frontImage.files[0]);
        data.append('backImage', document.formSubmit.backImage.files[0]);

        document.getElementById("sent").innerHTML = jsonString;
        document.getElementById("results").innerHTML = "";
        $.ajax({
                   url:getFileSubmitUrl(),
                   data:data,
                   cache: false,
                   processData: false,
                   contentType: 'multipart/form-data',
                   type:'POST',
                   success:function (data, status, req) {
                       handleResults(req);
                   },
                   error:function (req, status, error) {
                       handleResults(req);
                   }
               });
    }

</script>

양식은 다음과 같습니다.

<form name="formSubmit" action="#">
    userId: <input id="userId" name="userId" value=""/><br/>
    locale: <input name="locale" value="en_US"/><br/>
    front Image: <input type="file" name="frontImage"/><br/>
    back Image: <input type="file" name="backImage"/><br/>
    <input type="button" onclick="handleSubmit();" value="Submit"/>
</form>

도움을 주셔서 미리 감사드립니다!

무사의 반응은 아주 좋았습니다.내용 설정type to false가 양식 데이터를 올바르게 제출했습니다.감사합니다!

효과가 있었던 Ajax 호출은 다음과 같습니다.

$.ajax({
    url:getFileSubmitUrl(),
    data:data,
    cache:false,
    processData:false,
    contentType:false,
    type:'POST',
    success:function (data, status, req) {
        handleResults(req);
    },
    error:function (req, status, error) {
        handleResults(req);
    }
});

또한 이 코드도 작동한다는 것을 알게 되었습니다.

  var oReq = new XMLHttpRequest();
        oReq.open("POST", getFileSubmitUrl());
        oReq.addEventListener("error", transferComplete);
        oReq.addEventListener("load", transferComplete);
        oReq.addEventListener("abort", transferComplete);
        oReq.send(data);
    }
    function transferComplete(evt) {
        handleResults(evt.target);
    }

언급URL : https://stackoverflow.com/questions/13240664/how-to-set-a-boundary-on-a-multipart-form-data-request-while-using-jquery-ajax-f