SpringMVC AJAX异步文件上传

来源：互联网发布：买黄金软件下载编辑：程序博客网时间：2024/05/22 03:45

1、导入相关jar包

commons-fileupload-1.3.3.jar
commons-io-2.5.jar

2、在springmvc-config.xml配置文件中进行一下配置

<!--spring配置支持文件上传处理 MultipartResolver -->     <bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver">    <!-- 设置上传限制 -->    <property name="maxUploadSize" value="10000000"></property>    <property name="defaultEncoding" value="utf-8"></property></bean>

3、使用 @ResponseBody注解、@ResponseBody注解

示例代码（上传单个文件）

//文件上传@RequestMapping(value="/upload")@ResponseBodypublic Message uploadImg(HttpServletRequest request,@RequestParam("file") MultipartFile file) throws IllegalStateException, IOException{    Message message = new Message();    if(!file.isEmpty()){//判断文件非空、写入上传路劲        //获取上传路径        String path = request.getServletContext().getRealPath("/images/");        System.out.println(path);        //获取上传原始文件名        String fileName = file.getOriginalFilename();        System.out.println(fileName);        //防止用户上传相同名称的图片        String time = new Date().getTime()+"";        fileName = time+"_"+fileName;        File filePath = new File(path,fileName);//完整路径        System.out.println(filePath);        //判断路径是否存在、如果不存在、创建        if(!filePath.getParentFile().exists()){            filePath.getParentFile().mkdirs();        }        //上传图片        file.transferTo(filePath);        //生成缩略图        String smallName = time+"_small_"+file.getOriginalFilename();        File smallPath = new File(path, smallName);        Thumbnails.of(filePath).scale(0.2).toFile(smallPath);        message.setCode(1);        message.setInfo(fileName);        return message;    }else{        message.setCode(0);        message.setInfo("error");        return message;    }       }

上传多个文件（只需要传多个参数即可）

//多个文件上传@RequestMapping(value="/upload2")@ResponseBodypublic Message uploadImgs(        HttpServletRequest request,        @RequestParam(value="file",required=false) MultipartFile file,        @RequestParam(value="file1",required=false) MultipartFile file1) throws Exception{    Message message = new Message();    if(file!=null && !file.isEmpty()){//判断文件非空、写入上传路劲        //获取上传路径        String path = request.getServletContext().getRealPath("/images/");        //获取上传原始文件名        String fileName = file.getOriginalFilename();        //防止用户上传相同名称的图片        fileName = new Date().getTime()+"_"+fileName;        File filePath = new File(path,fileName);//完整路径        //判断路径是否存在、如果不存在、创建        if(!filePath.getParentFile().exists()){            filePath.getParentFile().mkdirs();        }        //上传图片        file.transferTo(filePath);        message.setCode(1);        message.setInfo(fileName);        return message;    }    if(file1!=null && !file1.isEmpty() ){//判断文件非空、写入上传路劲        //获取上传路径        String path = request.getServletContext().getRealPath("/images/");        //获取上传原始文件名        String fileName = file1.getOriginalFilename();        //防止用户上传相同名称的图片        fileName = new Date().getTime()+"_"+fileName;        File filePath = new File(path,fileName);//完整路径        //判断路径是否存在、如果不存在、创建        if(!filePath.getParentFile().exists()){            filePath.getParentFile().mkdirs();        }        //上传图片        file1.transferTo(filePath);        message.setCode(1);        message.setInfo(fileName);        return message;    }        message.setCode(0);        message.setInfo("error");        return message;    }@RequestMapping(value="/login")public ModelAndView islogin(User user,HttpSession session){    if(user.getUname().equals("admin")&&user.getUpwd().equals("admin")){        session.setAttribute("user", user);        ModelAndView mv = new ModelAndView();        mv.setViewName("index");        return mv;    }else{        ModelAndView mv = new ModelAndView();        mv.setViewName("login");        return mv;    }   }

4、前端需要使用ajaxfileupload.js(要配合Jeuery1.2以下版本使用)

示例代码

$('#file').change(function() {    $.ajaxFileUpload({        url : 'user/upload2',//用于文件上传的服务器端请`求地址        //type:'post',        secureuri : false,//一般设置为false        fileElementId : 'file',//文件上传空间的id属性  <input type="file" id="file" name="file" />        dataType : 'text',//返回值类型 test        success : function(data, status) //服务器成功响应处理函数        {            console.log(data);            alert(data.info);            if (data != null && data != "") {                $("#file").attr("title", data.info);            }        },        error : function(data, status, e)//服务器响应失败处理函数        {            alert(e);        }    });});

5、导入thumbnailator可进行缩略图上传

示例代码

@RequestMapping(value="/upload")@ResponseBodypublic Message uploadImg(HttpServletRequest request,@RequestParam("file") MultipartFile file) throws IllegalStateException, IOException{    Message message = new Message();    if(!file.isEmpty()){//判断文件非空、写入上传路劲        //获取上传路径        String path = request.getServletContext().getRealPath("/images/");        System.out.println(path);        //获取上传原始文件名        String fileName = file.getOriginalFilename();        System.out.println(fileName);        //防止用户上传相同名称的图片        String time = new Date().getTime()+"";        fileName = time+"_"+fileName;        File filePath = new File(path,fileName);//完整路径        System.out.println(filePath);        //判断路径是否存在、如果不存在、创建        if(!filePath.getParentFile().exists()){            filePath.getParentFile().mkdirs();        }        //上传图片        file.transferTo(filePath);        //生成缩略图        String smallName = time+"_small_"+file.getOriginalFilename();        File smallPath = new File(path, smallName);        Thumbnails.of(filePath).scale(0.2).toFile(smallPath);        message.setCode(1);        message.setInfo(fileName);        return message;    }else{        message.setCode(0);        message.setInfo("error");        return message;    }       }

阅读全文

0 0