Ajax向Springmvc后台传输文件（前后端分离）

1.前端通过ajax向后台传文件不可再使用JSON数据，而是需要使用Formdata对象。添加文件或者参数都需要使用append方法。

//创建文件传输使用的formdata对象
    var ajaxData = new FormData()
    //当用户选择文件之后，将文件添加到formdata对象中
    $("#file").on('change', function(){
        var selectFiles = document.getElementById("file").files
        for (let i = 0; i < selectFiles.length; i += 1){
            ajaxData.append('files', selectFiles[i])
        }
    })
    
//向对象中添加其它的参数
ajaxData.append('title', fileTitle)
ajaxData.append('id', loginUser.id)

// 打印ajax的formdata对象的方法
for (var [a, b] of ajaxData.entries()) {
            console.log(a, b);
        } 

2.通过Ajax传输文件的时候，ajax中的设置的参数有些许不同。不进行数据处理，不设置请求头信息和不使用JSON格式。

$.ajax({
     url: commonTargetHost + 'policy/upload.do',
       type: "post",
       processData: false, //不处理传递数据
       contentType: false, //不设置请求头内容 
       data: ajaxData,
       success: function(res){
           if (res.rst){
               alert(res.message)
           }else{
               alert(res.message)
           } 
       },
       error: function(res){
           console.log("请求错误", res);
       }
   })

3.后台springmvc接收数据方法，使用文件传输时候注意接受的格式以及添加HttpServletRequest request。

@RequestMapping("/upload")
	public Map<String, Object> uploadFile(@RequestParam("files") CommonsMultipartFile[] files,@RequestParam("title")String title,HttpServletRequest request) {	
	
		return uploadFilesService.uploadFile(files,title,id,request);
	}