转载-亲测可用SpringBoot 2.0 图片上传(支持批量上传)_spring multipartfile[] 批量图片-CSDN博客

自己更改了一点东西，以下为原文内容，原理不变，源代码无测试，仅记笔记用

Controller 层参数接收

@RequestMapping("/pic")
    @ResponseBody
    public BaseResponse uplodFile(@RequestParam("file") MultipartFile[] file) throws Exception {
        /*String originalFilename = file.getOriginalFilename();
        FileInputStream inputStream = (FileInputStream) file.getInputStream();*/
       /* System.out.println(inputStream);
        System.out.println(originalFilename);*/

        System.out.println("数组的长度"+file.length);
        for (int i = 0; i < file.length; i++) {
            String originalFilename = file[i].getOriginalFilename();
            InputStream inputStream = file[i].getInputStream();
            OSSUtil.uploadImageToOSS(originalFilename, inputStream);
        }
        return BaseResponse.ok(200,"OK");
    }

Web端代码，支持批量上传

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>File upload</title>
    <script src="../static/js/jquery-3.3.1.min.js"></script>
</head>
<body>
<div id="uploadForm">
    <input id="file" type="file" multiple/>
    <button id="upload" type="button" onclick="getUpload()">upload</button>
</div>
<script type="text/javascript">
    var length;
    $("#file").change(function () {
        length = this.files.length;
        console.log(length);
    })

    function getUpload(){
        var formData = new FormData();
        var arr=new Array();
        var container;
        var i=0;
        for(let i=0;i<length;i++){
            formData.append('file', $('#file')[0].files[i]);
            console.log(formData.get("file"));
        }
        container=formData.getAll("file");
        for (var item in container) {
            arr[i] = container[item];
            i++;
        }
        console.log(arr);
        $.ajax({
            url: '/pic',
            type: 'POST',
            dataType:"json",
            cache: false,
            data: formData,
            processData: false,
            contentType: false,
            success:(function(data) {
                window.confirm(data.code)
            }),
            error:(function(res) {
                alert("失败");
            })
        });
    }
</script>
</body>
</html>