Springboot实现文件的下载与上传
最近一段时间要学习一下springboot为后台的文件上传也下载,前端部分我使用uniapp来写
一.springboot后台部分
注意Java文件类以抽象的方式代表文件名和目录路径名。该类主要用于文件和目录的创建、文件的查找和文件的删除等。File对象代表磁盘中实际存在的文件和目录 点此学习JAVA文件类
- controller实现上传单个文件(主要看注解)
@RequestMapping("/file")
@RestController
public class FileController {
/**
* 上传单个文件
* @param file
* @return
*/
@PostMapping("/upload")
public String uploadFile(@RequestParam("file")MultipartFile file){
if(file.isEmpty()){ //若文件选择为空,就上传失败
return "上传失败,请选择文件!";
}
String fileName=file.getOriginalFilename();//获取文件上传的文件名
String filePath = "E:/fileSource"; //指定到上传的文件路径
File dir = new File(filePath);
if (!dir.exists()) { //若路径不存在,则创建一个这样的文件夹
dir.mkdir();
}
try {
File file1 = new File(filePath, fileName); //创建了一个File对象，名字是file1 ，路径是filePath，名字是fileName。
//然后就可以调用这个对象的相关方法完成文件创建，删除，读取，写入等操作
file.transferTo(file1); //将上传的文件写入创建好的文件中
return ("上传成功!文件路径为:"+filePath+"/"+fileName);
} catch (IOException e) {
e.printStackTrace();
}
return "上传失败!";
}
}
- 实现多个文件的上传(主要看注解),未进行测试
- 我这里返回了一个通用类CommonReturnType ,直接往里面注入object就可
/**
* 多文件上传
* @param request
* @return
*/
@PostMapping("/uploadFiles")
public CommonReturnType uploadFiles(HttpServletRequest request){
List successUploadFiles=new ArrayList(); //返回上传成功的文件名list给前端
List<MultipartFile> files = ((MultipartHttpServletRequest) request).getFiles("file"); //创建一个list接受前端发送的文件
String filePath = "E:/fileSource"; //指定上传的路径
File dir = new File(filePath);
if (!dir.exists()) { //若创建文件不存在则创建文件夹
dir.mkdir();
}
for (MultipartFile m:files) { //用foreach处理list列表中的file
if (m.isEmpty()) { //若某个文件为空则上传失败
return CommonReturnType.creat("上传文件名为:"+m.getOriginalFilename()+"失败!");
}
String fileName = m.getOriginalFilename();//获取某个上传文件的文件名
File dest = new File(filePath + "/"+fileName);
try {
m.transferTo(dest); //写入文件流
successUploadFiles.add(m.getOriginalFilename()); //增加到返回文件list中
} catch (IOException e) {
e.printStackTrace();
}
}
return CommonReturnType.creat(successUploadFiles);//返回list
}
- 配置文件上传的大小
application.properties配置文件添加：
# 上传文件总的最大值
spring.servlet.multipart.max-request-size=10000MB
# 单个文件的最大值
spring.servlet.multipart.max-file-size=10000MB
二.uniapp前端部分
这里用了uniapp来写前端部分
- 调用了uniapp组件处理选择文件
- 调用函数实现单个文件或多个文件的上传
<template>
<view class="content">
<button @click="upload">上传</button>
</view>
</template>
<script>
export default {
data() {
return {
text:"11",
fileDatas:''
}
},
methods: {
upload:function(){
var that=this
uni.chooseImage({
success: function (chooseImageRes) {
const tempFilePaths = chooseImageRes.tempFilePaths; //这里用数组保存选择的单个或多个文件
for (var i = 0; i < tempFilePaths.length; i++) {
uni.uploadFile({ //循环调用上传单个文件的接口,实现多文件上传
url: 'http://127.0.0.1:8093/file/upload', //仅为示例，非真实的接口地址
filePath: tempFilePaths[i],
name: 'file',
success: function (uploadFileRes) {
console.log(uploadFileRes);
}
});
}
},fail:function(chooseImageRes){
console.log("用户取消上传文件")
}
});
},
serachFiles:function(){
console.log("all datas")
}
}
}
</script>
<style>
.content {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
</style>
- 用了for循环,调用单文件上传的接口来处理多文件上传,即选择多个文件后,保存到数组中,for每次上传第i个文件,简单的实现多文件上传~~
- uniapp跨域问题未解决,刚上手,会的大佬教我一手~
制作不易,转载请标注~~
