后端上传代码如下
package com.mouday.demo.controller;
import org.springframework.stereotype.Controller;
import org.springframework.util.ResourceUtils;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.multipart.MultipartFile;
import java.io.File;
import java.io.FileNotFoundException;
import java.io.IOException;
import java.util.ArrayList;
import java.util.List;
/**
* 文件上传
* 参考
* https://blog.csdn.net/gnail_oug/article/details/80324120
*/
@Controller
public class FileController {
// 获取上传测试页面
@GetMapping("/upload")
public String upload() {
return "upload";
}
// 单文件上传
@PostMapping("/upload")
@ResponseBody
public String upload(MultipartFile file) {
if (file.isEmpty()) {
return "file is Empty";
}
String filename = file.getOriginalFilename();
try {
File path = this.getUploadDirectory();
File dest = new File(path, filename);
System.out.println(dest.getPath());
file.transferTo(dest);
return new File("/upload", filename).toString();
} catch (IOException e) {
e.printStackTrace();
return "error";
}
}
// 多文件上传
@PostMapping("/multiUpload")
@ResponseBody
public List<String> upload(@RequestParam("file") List<MultipartFile> files) {
List<String> list = new ArrayList<>();
for (MultipartFile file : files) {
list.add(this.upload(file));
}
return list;
}
/**
* 获取文件保存路径
* 参考：https://www.bbsmax.com/A/GBJrE67Wz0/
*
* @return
* @throws FileNotFoundException
*/
public File getUploadDirectory() throws FileNotFoundException {
String pathName = ResourceUtils.getURL("classpath:").getPath();
File path = new File(pathName, "/public/upload");
if (!path.exists()) {
path.mkdirs();
}
return path;
}
}
前端代码
src/main/resources/templates/upload.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h2>单文件上传</h2>
<form action="/upload" method="post" enctype="multipart/form-data">
<input type="file" name="file">
<input type="submit" value="提交">
</form>
<h2>多文件上传</h2>
<form action="/multiUpload" method="post" enctype="multipart/form-data">
<input type="file" name="file">
<input type="file" name="file">
<input type="file" name="file">
<input type="submit" value="提交">
</form>
</body>
</html>
因为前端页面需要使用模板引擎，所以需要引入依赖
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
application.properties 配置上传的文件大小限制
# 上传文件总的最大值
spring.servlet.multipart.max-request-size=10MB
# 单个文件的最大值
spring.servlet.multipart.max-file-size=10MB