springboot文件上传前端+后台接收文件(单文件+多文件)

SpringBoot+Jquery
1.单文件
前端Jquery

var url="..........";//上传地址
formData = new FormData();
//uploadFile就是后台接收的文件参数名称
formData.append('uploadFile', $('#file')[0].files[0]);
jQuery.ajax({
        type: 'post',
        url: url,
        data: formData,
        contentType: false,
        processData: false,
        success: function (data) {
        	alert("success");
        }
    })

后台接收

   @RequestMapping(value = "/pic/upload", method = RequestMethod.POST)
    public Response upload(@RequestParam("uploadFile") MultipartFile uploadFile) throws IOException {
        if (null == uploadFile) {
            return response("上传失败,无法找到文件!");
        }
        // BMP、JPG、JPEG、PNG、GIF
        String fileName = uploadFile.getOriginalFilename().toLowerCase();
        if (!fileName.endsWith(".bmp") && !fileName.endsWith(".jpg")
                && !fileName.endsWith(".jpeg") && !fileName.endsWith(".png")
                && !fileName.endsWith(".gif")) {
            return response("上传失败,请选择BMP、JPG、JPEG、PNG、GIF文件!");
        }
        //逻辑处理
        return response("成功");
    }

注:springboot文件上传时注意配置文件大小限制,参考https://blog.csdn.net/sinat_34888853/article/details/86237837

2.多文件
页面js



后端接收:

@RequestMapping(value = "/multiImport", method = RequestMethod.POST)
@ResponseBody
public Map multiImport(@RequestParam("uploadFile") MultipartFile[] uploadFile) {
    Map result = new HashMap();
    System.out.println(uploadFile.length);
    for (MultipartFile multipartFile:uploadFile) {
        System.out.println("文件"+multipartFile.getOriginalFilename());
    }
    return result;
}

你可能感兴趣的:(前端,spring,boot,spring,mvc)