Element ui + SpringBoot MultipartFile类实现文件上传

目的

将前端上传的文件保存到服务器，返回给前端文件在服务器的路径保存至数据库。

前端代码

<el-upload
        name="file"
        class="upload-demo"
        drag
        action="http://localhost:8081/media/fileupload/"
        :on-success="uploadSuccess"
        :on-error="error"
        multiple>
    <i class="el-icon-upload"></i>
    <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
    <div class="el-upload__tip" slot="tip">文件大小不超过100mb，多文件上传请压缩</div>
</el-upload>

后端Java代码

简单逻辑就是将SpringMvc的MultipartFile类转换为JDK的File类
要注意MultipartFile.getName()返回的是前端组件的name属性，也就是@RequestParam(“file”)注解中的“file"。getOriginalFilename()才是获得上传文件的名字

@PostMapping("/fileupload")
    public Result fileUpload(@RequestParam("file") MultipartFile file){
        String filename = file.getOriginalFilename();//获得文件原名 如：abc.txt
        log.info("开始上传文件====>{}", filename);
        String filePath = "E:/saving/";//存放目标文件的上一层路径
        File f = new File(filePath);
        //若不存在 E:/saving/ 则获取这个文件夹的父文件夹创建出 E:/saving/
        if (!f.exists()){
            f.getParentFile().mkdir();
        }
        //将要被储存的对象 E:/saving/abc.txt
        File target = new File(f.getAbsolutePath() +'/' + filename);
        //目标文件如果已经存在说明文件重名了，需要另起一个唯一的名字
        if (target.exists()){
            int i = filename.lastIndexOf('.');
            String originName = filename.substring(0, i);//文件名字 abc
            String suffix = filename.substring(i, filename.length()); //文件后缀 .txt
            target = new File(f.getAbsolutePath() +'/' + originName + UUID.randomUUID() + suffix);
        }
        //创建目标文件夹，此时目标文件肯定不存在
        target.getParentFile().mkdir();
        try {//储存过程
            file.transferTo(target);
            //返回目标文件的绝对路径
            return Result.success(target.getAbsolutePath());
        } catch (IOException e) {
            e.printStackTrace();
        }
        return Result.fail("上传失败");
    }

上传结果

这样子上传两个同名的文件就不会出现被覆盖的情况了。