文章目录
# 前端
## form 上传
## ajax 上传
# 后端
## MultipartFile
## MultipartHttpServletRequest
# 坑点:transferTo(File file)
# 另外
# 前端
## form 上传
form>
后台二进制文件进行接收:
这种方式写form标签必须要有
并且必须要有action、method、和enctype属性
且entype属性值必须为multipart/form-data
## ajax 上传
图片上传h4>
let files = this.files;
if(files.length){
let file = files[0] ;
let name = file.name;//读取选中文件的文件名
let size = file.size;//读取选中文件的大小
let formData = new FormData() ;
formData.append("mFile" , file) ;
formData.append("name" , name) ;
$.ajax({
url : '/demo/upload' ,
type: "POST" ,
data: formData,
processData: false , //告诉 jQuery 不要对参数进行处理
contentType: false , //高数jQuery 不要对contentType做处理,服务器会处理
success: function(result) {
console.log(result)
}
}) ;
console.log(url , name , avatar);
}
});script>
使用javascript的FormData来手动构建表单对象,
文件的二进制数据可以直接使用jQuery来获取到,
然后再通过ajax提交到服务端即可。
使用这种方法必须注意一下几点:
表单数据必须要由 FormData 来构建
processData 必须为false,告诉jQuery不要对参数进行处理
contentType 必须为false,告诉jQuery不要对contentType做处理,服务器会做处理
# 后端
## MultipartFile
以上面情况发送,后端能如下接收:
@RequestMapping("/demo/upload")
Map uploadFile(MultipartFile mFile) throws IOException {
//do something...
return null;
}
这里需要注意
我们使用SpringMVC的MultipartFile这个类来做文件的接收
这样的话得必须指定一个参数
这里是mFile,而且这个参数必须和前端的文件对应的name值一致
否则是接收不到文件的。
Done ~
## MultipartHttpServletRequest
那么如果前端没有指定参数,而是直接将文件的二进制流数据传过来又该怎么处理呢?
MultipartFile肯定是不能处理了
好在还有强大的SpringMvc封装了的 MultipartHttpServletRequest
可以直接将接收参数写为 MultipartHttpServletRequest 类型就可以了
这样就没有了参数名的约束
@RequestMapping("/demo/upload")
Map uploadFile(MultipartHttpServletRequest request) throws IOException {
//do something...
return null;
}
MultipartHttpServletRequest中的一系列getXxx方法可以直接获取到MultipartFile对象,简单方便。
# 坑点:transferTo(File file)
MultipartFile中封装了一个非常简单粗暴的方法transferTo(File file),可以直接将MultipartFile对象保存到指定的file文件中,but~
public void transferTo(File dest) throws IOException, IllegalStateException {
this.part.write(dest.getPath());
if (dest.isAbsolute() && !dest.exists()) {
FileCopyUtils.copy(this.part.getInputStream(), Files.newOutputStream(dest.toPath()));
}
}
在它的接口实现类中是这样写的,传入的file路径必须是绝对路径并且存在才可以写入,否则…什么都没有发生,是的连异常都没有,可以说是凭本事坑了
# 另外
文件上传涉及到的其他的东西都是基本操作,总的来说,思路就三种
和前端约定好接口格式,参数命名,大小限制等等,使用MultipartFile来接收,简单粗暴,推荐
使用MultipartHttpServletRequest来接收请求,再从请求中获取MultipartFile
在请求中获取字节流数据,代码繁琐,效率低下,不推荐
《jQuery文件上传以及MultipartFile踩坑指南》