一、单个文件上传

1、创建工程,引入依赖

   <dependencies>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-web</artifactId>
        </dependency>

        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-test</artifactId>
            <scope>test</scope>
        </dependency>
    </dependencies>

2、编写controller

**
 * @Author ChoiBin
 * @Date 2019-07-29 14:01
 * @Version 1.0
 */

@RestController
public class FileUploadController {

    //创建一个时间格式,方便图片分类
    SimpleDateFormat simpleDateFormat = new SimpleDateFormat("/yyyy/MM/dd/");

    @PostMapping("/upload")
    public String upload(MultipartFile file, HttpServletRequest request){
        String format = simpleDateFormat.format(new Date());
        String realPath = request.getServletContext().getRealPath("/img") + format;
        File folder = new File(realPath);
        if(!folder.exists()){
            folder.mkdirs();
        }
        String oldName = file.getOriginalFilename();
        String newName = UUID.randomUUID().toString() + oldName.substring(oldName.lastIndexOf("."));
        try {
            file.transferTo(new File(folder,newName));
            String url = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + "/img" + format + newName;
            return url;
        }catch (IOException e){
            e.printStackTrace();
        }
        return "error";
    }
}

3、编写HTML代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<form action="/upload" method="post" enctype="multipart/form-data">
    <input type="file" name="file">
    <input type="submit" value="提交">
</form>
</body>
</html>

4、测试结果

5、如何修改上传的文件大小

application.properties配置文件添加:
# 上传文件总的最大值
spring.servlet.multipart.max-request-size=10MB
# 单个文件的最大值
spring.servlet.multipart.max-file-size=10MB

二、用Ajax上传文件

1、修改HTML代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div id="result"></div>
<input type="file" name="file">
<input type="button" value="上传" onclick="uploadFile()">

<script>
    function uploadFile() {
        var file = $("#file")[0].files[0];
        var formData = new FormData();
        formData.append("file",file);
        $.ajax({
            type:"post",
            url:"/upload",
            processData:false,
            contenType:false,
            data:formData,
            success:function (msg) {
                $("result").html(msg);

            }
        })
    }
    
</script>
</body>
</html> 
后端代码保持不变,只需更改前端代码

三、多个文件上传

1、编写HTML代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<form action="/uploads" method="post" enctype="multipart/form-data">
    <input type="file" name="files" multiple>
    <input type="submit" value="提交">
</form>
</body>
</html>

2、编写controller

    @PostMapping("/uploads")
    public String uploads(MultipartFile[] files, HttpServletRequest request){
        String format = simpleDateFormat.format(new Date());
        String realPath = request.getServletContext().getRealPath("/img") + format;
        File folder = new File(realPath);
        if(!folder.exists()){
            folder.mkdirs();
        }
        for (MultipartFile file : files) {
            String oldName = file.getOriginalFilename();
            String newName = UUID.randomUUID().toString() + oldName.substring(oldName.lastIndexOf("."));
            try {
                file.transferTo(new File(folder,newName));
                String url = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + "/img" + format + newName;
                System.out.println(url);
            }catch (IOException e){
                e.printStackTrace();
            }
        }
        return "success";
    } 
如果需要实现多个文件上传,那么controller就用一个MultipartFile数组来接收前台传进来的文件;如果是在多个<input>标签上的图片文件,那么controller上就写多个MultipartFile,与<input>标签上的name对应即可。

3、测试结果