表单数据以及使用 Ajax 和 spring 上传文件答案

【问题标题】：form data along with file upload with Ajax and spring表单数据以及使用 Ajax 和 spring 上传文件
【发布时间】：2015-12-22 06:49:45
【问题描述】：

我正在使用 spring ， Ajax 并尝试将文件与其他数据一起上传

 if(form.field_UploadFile != undefined){
        formContent.field_UploadFile=$( form.field_UploadFile  )[0].files[0];
        }
   var fields ={};
   for(var i=0; i<form.elements.length; i++){
       if (form.elements[i].name){
       if(form.elements[i].name.substring(0,6)=="field-"){
           if(form.elements[i].type=='checkbox'){
              if(form.elements[i].checked){
                   fields[form.elements[i].name]='checked';
               }else{
                   fields[form.elements[i].name]='unchecked';
               }
           }else{
                fields[form.elements[i].name]=form.elements[i].value;
           }
       }
       }
   }

   $.ajax({  
       type: "POST",  
       url: "${pageContext.request.contextPath }/forms/createnocaptcha",
       data: formContent,  
       dataType: "json",  
       contentType: false, 
       processData: false,

       complete: function (xhr, status) {
            $('html, body').animate({ scrollTop: 0 }, 0);              
            if (status === 'error' || !xhr.responseText) {
                //alert("error");
                $("#" + messagedivid).addClass("errorMessage");
                $("#" + messagedivid).html("Form sunewsbmission error");
            }
            else {
                var data = xhr.responseText;
                //$("#" + messagedivid).addClass("successMessage");
                //$("#" + messagedivid).html(data);
                $("#" + feedbackdivid).addClass("successMessage");
            $("#" + feedbackdivid).show();
            $("#" + messagedivid).hide();
            $(form)[0].reset();
            }

控制器

@RequestMapping(value = "/forms/createnocaptcha", method=RequestMethod.POST)
@ResponseBody
public String createPageNoCaptcha( Form formContent, HttpServletRequest request, HttpSession session){
    boolean status = false;

如果我将 requestBody 放在 formContent 中，则会得到 415 个不受支持的媒体，如果将其删除，则表单值为空。

我也可以对多部分和非多部分使用相同的控制器。

请指教

谢谢

【问题讨论】：

我已经更改了我的代码，因此它进行了 2 个 ajax 调用，一个用于添加其他数据，一个用于上传文件。但是当我尝试上传时，我得到“当前请求不是多部分请求”
函数uploadFile(form){ var formFile= new Object()); formFile.UploadFile=$(form.UploadFile)[0].files[0]; $.ajax({ type: "POST", url: "${pageContext.request.contextPath }/forms/fileUpload", data: formFile, enctype: 'multipart/form-data', contentType: false, processData: false,成功：函数（数据）{警报（“文件上传”）；}，错误：函数（）{警报（'请求时出错..'）；}}）；

标签： ajax spring

【解决方案1】：

我们需要将js对象转换成JSON字符串再发送。

像这样在 ajax 调用中更改您的数据，

data: JSON.stringify(formContent),

然后使用@RequestBody Form formContent 并将 Ajax 调用中的 contentType 更改为 application/json

【讨论】：

如果我把 stringify 和 RequestBody ，得到 415 Unsupported Media
在 Ajax 调用期间使用 application/json 作为内容类型