使用ajax的javaspring上传文件

如何通过ajax发送文件

我知道如何使用默认表单将文件上载到服务器，我的意思是：

<div class="addBook" >
<form id="add" action="/add" method="post" enctype="multipart/form-data">
    <div class="form-group">
        <label for="title">Title</label>
        <input name="title" type="text" class="form-control" id="title" placeholder="title">
    </div>
    <div class="form-group">
        <label for="description">Description</label>
        <textarea name="description" class="form-control" id="description" rows="3"></textarea>
    </div>
    <div class="form-group">
        <label for="picture">file input</label>
        <input name="picture" type="file" class="form-control-file" id="picture">
    </div>
    <button type="submit" class="btn btn-primary">Submit</button>
</form>

标题
描述
文件输入
提交

和该代码的控制器

@RequestMapping(value = "/add", method = RequestMethod.POST)
public ResponseEntity<String> add(
        @RequestParam(value = "title",required = false)String title,
                  @RequestParam(value = "description",required = false)String description,
                  @RequestParam(value = "picture",required = false)MultipartFile file){
    Book book = new Book();
    book.setFileName(addFile(file));
    book.setTitle(title);
    book.setDescription(description);


    return new ResponseEntity<String>("index", HttpStatus.OK);
    }
}

@RequestMapping（value=“/add”，method=RequestMethod.POST）
公众反应补充(
@RequestParam（value=“title”，required=false）字符串标题，
@RequestParam（value=“description”，required=false）字符串说明，
@RequestParam（value=“picture”，required=false）多部分文件{
书=新书（）；
book.setFileName（addFile（file））；
书名（书名）；
书.集说明（说明）；
返回新的响应属性（“索引”，HttpStatus.OK）；
}
}

这段代码可以工作，但我想用ajax编写它。我试过这个：

$(document).ready(function () {
    $("#add").submit(function (e) {
        e.preventDefault();
        $.ajax({
            url:'/add',
            type:'POST',
            contentType:"multipart/form-data",
            statusCode:{
                409:function () {
                    $("#mess").html('<b>Логин занят</b>');
                },
                200:function(){
                    console.log("successfull")
                }
            }
        })
    })
})

$（文档）.ready（函数（）{
$（“#添加”）。提交（功能（e）{
e、 预防默认值（）；
$.ajax({
url:“/add”，
类型：'POST'，
contentType:“多部分/表单数据”，
状态代码：{
409：函数（）{
$（“#mess”）.html（'；
},
200:函数（）{
console.log（“成功”）
}
}
})
})
})

但我得到了以下错误：

2018-08-03 21:00:29.317错误9204---[nio-8080-exec-3] o、 a.c.c.c.[/].[dispatcherServlet]：的Servlet.service（） 路径为[]的上下文中的servlet[dispatcherServlet]引发异常 [请求处理失败；嵌套异常为 org.springframework.web.multipart.MultipartException:未能分析 多部分servlet请求；嵌套异常为java.io.IOException: org.apache.tomcat.util.http.fileupload.FileUploadException: 请求被拒绝，因为找不到具有的多部分边界] 根本原因

---

我在Google中搜索过，但没有找到任何解决方案。

您在“$.ajax”调用中没有提交任何“数据”，因此您没有发送任何文件并收到此错误。请参阅相关主题和示例：