SSM AJAX异步文件上传和下载+效果实现图

 简单介绍:使用工具:IDEA   MySQL     框架:Spring、Springmvc 、Mybatis

必要JAR包:commons-io-*.jar commons-fileupload.jar

异步上传的实现效果:

1、首先是界面加载出来的效果

2、点击“选择文件”,选择需要上传的文件,显示出要上传的文件名称,然后点击“上传”

3出现下图的效果,如果发现文件传了,可以点击“更换文件”,变换到步骤1重新选择文件即可。

一、文件上传

1、在工程中建立一个upload文件夹,并在项目的文件夹相关路径中也建立upload文件,如下面两幅图所示。

SSM AJAX异步文件上传和下载+效果实现图_第1张图片

SSM AJAX异步文件上传和下载+效果实现图_第2张图片

2、前端,异步上传文件

需要jar包ajaxfileupload.js

action="请求Controller路径" enctype="multipart/form-data">

根据项目需求,文件需要异步上传,文件上传后且表单信息填写完成点击提交,执行form中action

注意:method="post"为表单请求方式,优点是安全并且不限制大小,红色部分表示以二进制码形式传输数据,用于上传文件,必须填写。

下面是表单中

 
   
        
电子版扫描件:

下面是JSP中的ajax

下面是文件上传的Controller

@RequestMapping(value="/upImage",method = RequestMethod.POST) 
 @ResponseBody         //@RequestParam("scan") 数据库中该属性的名称 
	    public String execute(@RequestParam(value="scan",required = false) MultipartFile file, HttpServletRequest request){
	    
	  //("/upload")是表示文件上传后的目标文件
         String path = request.getSession().getServletContext().getRealPath("/upload");
            //获取文件名称
            String fileFileName=file.getOriginalFilename();
	        try {
                //File f = new File(path + "/" + fileFileName);
                //创建File对象,传入目标路径参数和文件名称
                File dir = new File(path,fileFileName);
                if(!dir.exists()){  //如果dir代表的文件不存在,则创建
                    dir.mkdir();
                }
             //如果存在就执行下面操作
                file.transferTo(dir);//将上传的实体文件复制到制定目录upload下
            }catch (Exception e) {
                e.printStackTrace();
                message = "上传异常!!!!";
                return message;
            }
	        //String json= JSONUtils.valueToString(fileFileName);
            return fileFileName;

	    }

 

二、文件下载

下面前端

请点击下载:moni.jpg

下面是Controller

//文件下载
    @RequestMapping(value="/download",method=RequestMethod.GET)
    public void download(@RequestParam(value="scan")String filename,
                         HttpServletRequest request,
                         HttpServletResponse response) throws IOException {
        //获取需要下载的文件的路径
        String path = request.getSession().getServletContext().getRealPath("/upload") + "\\" + filename;
        //获取输入流
        InputStream bis = new BufferedInputStream(new FileInputStream(new File(path)));
        //转码,免得文件名中文乱码
        filename = URLEncoder.encode(filename, "UTF-8");
        //设置文件下载头
        response.addHeader("Content-Disposition", "attachment;filename=" + filename);
        //1.设置文件ContentType类型,这样设置,会自动判断下载文件类型
        response.setContentType("multipart/form-data");
        BufferedOutputStream out = new BufferedOutputStream(response.getOutputStream());
        int len = 0;
        while ((len = bis.read()) != -1) {
            out.write(len);
            out.flush();
        }
        out.close();
    }

 

你可能感兴趣的:(SSM AJAX异步文件上传和下载+效果实现图)