Question

我正在使用Spring Boot。我想使用AJAX调用上传文件以及一些数据。但是，当我输入数据时，选择文件，然后单击“提交”按钮，就会出现以下异常：

org.apache.tomcat.util.http.fileupload.FileUploadException：由于未找到多部分边界，请求被拒绝

<form  id="course-form" enctype="multipart/form-data">
  <input type="text" class="form-control" placeholder="Course Name" name="courseName" id="courseName">
  <input type="text" class="form-control" placeholder="Total no of sets" name="noOfSets" id="noOfSets">
  <input type="text" class="form-control" placeholder="Total fees" name="fees" id="fees">
  <input type="file" class="form-control" placeholder="Select an image" name="image" id="image">
  <input type="text" name="requirements" id="requirements" class="form-control">
  <input type="text" name="requirements" id="requirements" class="form-control">
  <input type="button" value="Add more requirements" id="add-req">
  <input type="submit" value="Submit">
</form>

ajax通话

function saveCourse(){
             var itemData=new FormData($("#courseForm")[0]);
            $.ajax({
                type : "POST",
                url : "/course/save",
                data : itemData,
                async: false,
                processData : false,
                cache : false,
                contentType : 'multipart/form-data',
                success : function(result) {
                    if(result.message !=null){
                    alert(result.message);
                    }
                },
                error : function(e){
                    alert("Error! Please enter proper data");
                }
            });
            return false;
        }

控制器类

@PostMapping(value="/course/save")
public ResponseDTO addCourse(MultipartHttpServletRequest request, CourseDTO courseDTO) 
{
  System.out.println("Course controller save menthod started");
  return null;
}

为什么我会收到此例外？而且，我该如何解决这个问题？

Answer 1

似乎您丢失了没有设置enctype的功能，应该明确设置contentType: false,：

function saveCourse() {
  var form = $('#course-form')[0];
  var courseData = new FormData(form);
  $.ajax({
    type : "POST",
    url : "/course/save",
    contentType: false,
    data: courseData,
    processData: false,
    success: function(result) {
      if (result.message != null) {
        alert(result.message);
      }
    },
    error: function(e) {
      alert("Error! Please enter proper data");
    }
  });
  return false;
}

通过忽略它，浏览器将负责生成具有多部分边界的正确内容类型，例如：

content-type: multipart/form-data; boundary=----WebKitFormBoundaryQ0pBuvRC1EzDAQWT````

Answer 2

问题通过以下ajax代码解决了

 var itemData=new FormData($("#courseForm")[0]);
        $.ajax({
            type : "POST",
            url : "/course/save",
            data : itemData,
            dataType : "json"
            processData : false,
            cache : false,
            contenttype : false;
            success : function(result) {
                if(result.message !=null){
                alert(result.message);
                }
            },
            error : function(e){
                alert("Error! Please enter proper data");
            }
        });
        return false;

我们需要使用@RequestParam批注在控制器中获取数据，并使用@RequestPart批注在文件中获取

Spring Boot：请求被拒绝，因为在使用Ajax调用的Spring Boot中没有找到多部分边界？

2 个答案: