SpringMVC下的Ajaxfileupload实现文件异步上传

SpringMVC下的Ajaxfileupload实现文件异步上传

依赖

    
      commons-fileupload
      commons-fileupload
      1.3.1
    
    
      commons-io
      commons-io
      2.4
    

在 SpringMVC 中声明文件上传的组件

在前端写出文件上传的组件，要注意的是文件上传标签的 id 和 name 必须保持一致，如下图的：imgPath

     图片介绍 
     上传图片
     

JQuery 代码

$(function (){
    $("#file")[0].onclick = function (){
        $.ajaxFileUpload({
            url:"fileupload",
            secureuri:false,
            fileElementId:"imgPath",
            dataType:"JSON",
            success:function (resp){
                alert(resp);
                $("#fileimg").attr("src",resp);
            }
        })
    }
})

在后端写出控制器方法

PS:

后台接收文件的MultipartFile 的形参名必须与前端 的 id 名一致，否则会找不到上传文件

对于SpringMVC中的 Object 为返回值的控制器方法
若想返回对象，则使用：produces="application/json;charset=utf-8"
若想返回String，则使用：produces="text/html;charset=utf-8"

@Controller
public class ProductionController {

    //异步Ajax文件上传
    @ResponseBody
    @RequestMapping(value="/fileupload",produces="text/html;charset=utf-8")
    public Object fileUpload(MultipartFile imgPath, HttpServletRequest request,
                             HttpSession session) throws IOException {

        //获取存储图片的用户级目录
        String savePath = request.getServletContext().getRealPath("/") +
                    "static\image_user\" + session.getAttribute("username");
        //若用户级目录不存在创建用户根目录
        File userDirectory = new File(savePath);
        if(! userDirectory.exists()){
            userDirectory.mkdir();
        }
        //为文件起新名字
        String fileName = FileUtils.getNewName(imgPath);
        //将上传的文件转存到指定的用户级目录
        imgPath.transferTo(new File(savePath,fileName));
        //将路径返回到前端
        return "static/image_user/"+session.getAttribute("username")+"/"+fileName;

    }
}