Spring Boot 文件上传

通过 MultipartFile 来处理文件上传：

1public String handleFormUpload(String name,MultipartFile file) throws IOException {
2    if(!file.isEmpty){
3        String fileName = file.getOriginalFilename();
4        InputStream ins = file.getInputStream();
5        
6        // ...
7        
8        return "success";
9    }
10    return "failure";
11}

MultipartFile 提供了一下方法来获取上传文件的信息。

getOriginalFilename 获取上传文件的名字。
getBytes 获取上传文件内容，转为字节数组。
getInputStream 获取一个 InputStream
isEmpty 上传文件内容为空，或者就没有文件上传
getSize 文件上传的大小
transferTo（File dest）保存上传文件到目标文件系统。

在 HTML 前端的代码

1<form enctype="multipart/form-data" method="POST">
2    <input type="file" multiple="multiple" name="file">
3</form>

可以通过配置文件 application.properties 对 Spring Boot 上传的文件进行限定。

1spring.servlet.multipart.enabled=true
2spring.servlet.multipart.file-size-threshold=0
3spring.servlet.multipart.location=
4spring.servlet.multipart.max-file-size=1MB
5spring.servlet.multipart.max-request-size=10MB
6spring.servlet.multipart.resolve-lazily=false

参数 enabled 默认为 true，即允许附件上传。

file-size-threshold 限定了当上传的文件超过一定长度时，就先先写到临时文件里。这有助于上传文件不占用过多内存，单位时 MB 或者 KB。默认是0，不限定阈值。

location 值指的是临时文件的存放目录，如果不限定，则是 Web 服务器提供的一个临时目录。

max-file-size 属性指定了单个文件的最大长度，默认是 1 MB

max-request-size 属性说明单次 HTTP 请求上传的最大长度，默认 10 MB

通过 Ajax 来上传文件。

1$.ajax({    
2     url : "http://localhost:8080/STS/rest/user",    
3     type : "POST",    
4     data : $( '#postForm').serialize(),    
5     success : function(data) {    
6          $( '#serverResponse').html(data);    
7     },    
8     error : function(data) {    
9          $( '#serverResponse').html(data.status + " : " + data.statusText + " : " + data.responseText);    
10     }    
11});

通常我们提交（使用submit button）时，会把form中的所有表格元素的name与value组成一个queryString，提交到后台。这用jQuery的方法来说，就是serialize。

通过$('#postForm').serialize()可以对form表单进行序列化，从而将form表单中的所有参数传递到服务端。

但是上述方式，只能传递一般的参数，上传文件的文件流是无法被序列化并传递的。不过如今主流浏览器都开始支持一个叫做FormData的对象，有了这个FormData，我们就可以轻松地使用Ajax方式进行文件上传了。

使用 Form Data 来上传文件

XMLHttpRequest Level 2添加了一个新的接口FormData.利用FormData对象,我们可以通过JavaScript用一些键值对来模拟一系列表单控件,我们还可以使用XMLHttpRequest的send()方法来异步的提交这个"表单".比起普通的ajax,使用FormData的最大优点就是我们可以异步上传一个二进制文件。

获取一个 FormData 对象有三种方式

创建一个空的 FormData 对象

1var formdata = new FormData()
2formdata.append("name","Yang")
3formdata.append("url","http://dowhile.net")

取得form元素对象，将它作为参数传入FormData对象中

var formobj = document.getElementById("form") var formdata = new FormData(formobj)
利用form元素对象的getFormData方法生成它

var formobj = document.getElementById("form") var formdata = formobj.getFormData()

FormData 对象的一些常用方法

FormData.append 本方法用于向已存在的键添加新的值，如该键不存在，新建之。
FormData.delete 将一对键和值从 FormData 对象中删除。 formData.delete(username)
FormData.get 返回给定键的所有值
FormData.has 检查是否包含给定键，返回 true 或 false

Ajax通过FormData上传文件

1<form id="uploadForm" enctype="multipart/form-data">
2    <input id="file" type="file" name="file"/>
3    <button id="upload" type="button">upload</button>
4</form>
5
6
7$.ajax({
8    url: '/upload',
9    type: 'POST',
10    cache: false,
11    data: new FormData($('#uploadForm')[0]),
12    processData: false,
13    contentType: false
14}).done(function(res) {
15}).fail(function(res) {});

这里要注意几点：

processData设置为false。因为data值是FormData对象，不需要对数据做处理。
<form>标签添加enctype="multipart/form-data"属性。
cache设置为false，上传文件不需要缓存。
contentType设置为false，不设置contentType值，因为是由<form>表单构造的FormData对象，且已经声明了属性enctype="multipart/form-data"，所以这里设置为false

Spring Boot 文件上传

评论区

相关推荐