Java的Springboot框架结合AJAX实现form表单图片上传-详解

	
		场地图片:
		
			
			
		
	
	
		联系人:
		
			
		
	

$("body").on("change","#file",function(e){
    var formData = new FormData($("#typeForm")[0]);
    $.ajax({
        url: "/admin/upload",
        type: "post",
        data: formData,
        contentType:"application/x-www-form-urlencoded; charset=utf-8",
        async: false,
        cache: false,
        contentType: false,
        processdata: false,
        success: function(data){
            console.log(data)
            $("#type_image").attr("value",data);
        }
    });
});

@RestController()
@RequestMapping("/admin")
public class AdminController {

    @Value("${filePath}")
    private String filePath = "C:upload";
	
	
    @PostMapping("/upload") // 等价于 @RequestMapping(value = "/upload", method = RequestMethod.POST)
    public String uplaod(HttpServletRequest req, @RequestParam("file") MultipartFile file) {//1. 接受上传的文件  @RequestParam("file") MultipartFile file
        try {
            //2.根据时间戳创建新的文件名，这样即便是第二次上传相同名称的文件，也不会把第一次的文件覆盖了
            //获取文件的后缀名 .jpg
            int lastIndexOf = file.getOriginalFilename().lastIndexOf(".");
            String suffix = file.getOriginalFilename().substring(lastIndexOf);
            String fileName = System.currentTimeMillis() + suffix;
            //3.通过req.getServletContext().getRealPath("") 获取当前项目的真实路径，然后拼接前面的文件
            //String destFileName = req.getServletContext().getRealPath("") + "uploaded" + File.separator + fileName;
            String destFileName = filePath+File.separator+fileName;
            //4.第一次运行的时候，这个文件所在的目录往往是不存在的，这里需要创建一下目录（创建到了webapp下uploaded文件夹下）
            File destFile = new File(destFileName);
            destFile.getParentFile().mkdirs();
            //5.把浏览器上传的文件复制到希望的位置
            file.transferTo(destFile);
            //6.把文件名放在model里，以便后续显示用
            return "/"+fileName;
        } catch (FileNotFoundException e) {
            e.printStackTrace();
            return "上传失败," + e.getMessage();
        } catch (IOException e) {
            e.printStackTrace();
            return "上传失败," + e.getMessage();
        }
    }
}

OK！分享一波用法！不会的给我私信或者回复留言！
觉得有帮助的可以关注一波！经常分享编程踩坑经验！