sprinboot 普通文件上传、ajax上传、多文件上传（亲测可用）

本文链接：https://blog.csdn.net/weixin_45408862/article/details/106390369

首先是最简单的文件上传，下面是前后端代码，就不做详细介绍

后端：

package com.demo.controller;

import com.demo.model.Emp;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.RestController;
import org.springframework.web.multipart.MultipartFile;

import javax.servlet.http.HttpServletRequest;
import java.io.File;
import java.io.IOException;
import java.text.SimpleDateFormat;
import java.util.Date;
import java.util.UUID;


@RestController
public class FileUploadController {

    SimpleDateFormat sdf = new SimpleDateFormat("/yyyy/MM/dd");

    @PostMapping("/upload")
    public String upload(@RequestParam("file") MultipartFile file, Emp emp, HttpServletRequest request){
        String format = sdf.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));
            //接下来就是吧路径保存到数据库中

            System.out.println(emp.getUsername()+emp.getPassword());
            String url = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+"/img"+format+newName;
            return url;
        } catch (IOException e) {
            e.printStackTrace();
        }
        return "error";
    }
}

前端jsp:

<form action="/upload" method="post" enctype="multipart/form-data">
    用户名：<input type="text" name="username">
    密码：<input type="password" name="password">
    头像：<input type="file" name="file" value="选择">
    <input type="submit" value="提交">
</form>

使用ajax进行单文件上传，后端接口和上面一直，前端使用ajax发送请求，之贴出前端代码，如下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript" src="/webjars/jquery/3.4.1/jquery.js"></script>
</head>
<body>
<div id="result"></div>
<input type="file" id="file"><br>
<input type="button" value="上传" onclick="uploadFile()">
<script>

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

多文件上传（未使用ajax方式）
后端代码

    @PostMapping("/uploads")
    public String uploads(MultipartFile[] files, HttpServletRequest req){
        String format =sdf.format(new Date());
        String realPath = req.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 = req.getScheme()+"://"+req.getServerName()+":"+req.getServerPort()+"/img"+format+newName;
                System.out.println(url);
            } catch (IOException e) {
                e.printStackTrace();
            }
        }

        return "success";
    }

前端代码（需要在input标签上加multiple属性，表明可以选择多个文件）：

<!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><br>
    <input type="submit" value="提交">
</form>
</body>
</html>