1. 简介



提供基于spring实现文件(笔记附件)的上传和下载的完整方案。方案将文件上传,并将文件名称作为字段与关联的笔记绑定在一起,更新笔记在数据库中的记录。显示笔记时,根据笔记所绑定的文件名生成下载路径,提交给服务端完成下载。



2. 文件上传

2. 1 前端



在html中插入一个表单用于提交文件



[html] view plain copy


1. <form id= "uploadForm">
2. <input type="file" name="file" id="file"/>
3. <input type="button" id="upload" value="上传附件"/>
4. </form>


编写js给button单击事件,发送ajax请求,将文件数据上传给服务端,服务端返回存储的真实文件名,将文件名绑定在笔记元素上,在保存笔记时,将文件名写入相应笔记的数据库记录中。


[javascript] view plain copy



    1. //给上传文件按钮绑定事件
    2. "#upload").click(uploadFile);




    [javascript] view plain copy



    1. function
    2. //获得上传文件
    3.     $.ajax({  
    4. 'file/upload.do',  
    5. 'POST',  
    6. false,  
    7. new FormData($('#uploadForm')[0]),  
    8. false,  
    9. false,  
    10. function(result){  
    11. var $checkedLi = $("#note_list li a.checked").parent();  
    12. "attachment",result.data);  
    13. "上传成功"+result.data);  
    14.         }  
    15.     });   
    16. }



    1. 2 后端



    采用CommonsMultipartResolver,需要导入commons-fileupload-1.2.1.jar和commons-io-1.3.2.jar,sc是ServletContext的引用,用实现ServletContextAware接口的方式获得。



    [java] view plain copy


    1. public JsonResult upload(HttpServletRequest request,HttpServletResponse response) throws
    2. new
    3. try{  
    4. "utf-8");  
    5. //创建一个通用的多部分解析器
    6. new
    7. //判断 request 是否有文件上传,即多部分请求
    8. if(multipartResolver.isMultipart(request)){  
    9. //转换成多部分request  
    10.             MultipartHttpServletRequest multiRequest =           
    11.                     multipartResolver.resolveMultipart(request);  
    12. //取得request中的所有文件名
    13.             Iterator<String> iter = multiRequest.getFileNames();  
    14. while(iter.hasNext()){  
    15. //取得上传文件
    16.                 MultipartFile file = multiRequest.getFile(iter.next());  
    17. if(file != null){  
    18. //取得当前上传文件的文件名称
    19.                     String myFileName = file.getOriginalFilename();  
    20. //如果名称不为“”,说明该文件存在,否则说明该文件不存在
    21. if(myFileName.trim() !=""){  
    22. //重命名上传后的文件名
    23.                         String fileName = file.getOriginalFilename();  
    24. //定义上传路径
    25. "/WEB-INF/files/");  
    26. new
    27. if(!dir.exists()){  
    28.                             dir.mkdirs();  
    29.                         }  
    30. new File(dir, NoteUtil.creatId().substring(30)+"-"+fileName);  
    31.                         file.transferTo(localFile);  
    32. //结果绑定文件路径
    33. 0);  
    34.                         result.setData(localFile.getName());  
    35. "上传成功");  
    36.                     }  
    37.                 }  
    38.             }  
    39.         }  
    40.   
    41. catch(Exception e){  
    42.         e.printStackTrace();  
    43. throw
    44.     }  
    45. 1);  
    46. return
    47. }


    2. 文件下载



    2. 1 前端



    由于get请求存在中文编码异常的问题,所以采用post请求,首先获取元素中绑定的文件名,生成一个表单



    [javascript] view plain copy


    1. if(attachment!=null){  
    2. var form_str = '<form action="file/download.do" method="post">'+  
    3. '<input type="hidden" name="fileName" value="'+attachment+'"></input>'+  
    4. '<input type="submit" value="下载附件"></input>'+  
    5. '</form>';  
    6. "#download_attachment").html(form_str);  
    7. }



    2. 2 后端



    后端需要解决中文文件名无法正常显示的问题,采用ISO8859-1字符集



    [java] view plain copy



    1. public void download(HttpServletResponse response, String fileName) throws
    2.     System.out.println(fileName);  
    3. "/WEB-INF/files/"+fileName;  
    4.     String fileFullPath = sc.getRealPath(filePath);  
    5. new
    6. if(file.exists()){  
    7. //重置response
    8.         response.reset();  
    9. "utf-8");  
    10. "text/html;charset=utf-8");  
    11. //设置http头信息的内容
    12. /           response.addHeader("Content-Disposition", "attachment;filename=\""+fileName+"\"");  
    13. //解决中文文件名显示问题
    14. "Content-Disposition", "attachment;filename="+new String(fileName.getBytes("gb2312"),"ISO8859-1"));  
    15. //设置文件长度
    16. int fileLength = (int)file.length();  
    17.         response.setContentLength(fileLength);  
    18.           
    19. if(fileLength!=0){  
    20. new
    21. byte[] buf = new byte[4096];  
    22.               
    23. //创建输出流
    24.             ServletOutputStream servletOS = response.getOutputStream();  
    25. int
    26.               
    27. //读取文件内容并写入到response的输出流当中
    28. while((readLength = inStream.read(buf))!=-1){  
    29. 0, readLength);  
    30.             }  
    31. //关闭输入流
    32.             inStream.close();  
    33.               
    34. //刷新输出流缓冲
    35.             servletOS.flush();  
    36.               
    37. //关闭输出流
    38.             servletOS.close();  
    39.         }  
    40. else{  
    41. "text/html;charset=utf-8");  
    42.         PrintWriter out = response.getWriter();  
    43. "文件\""+fileName + "\"不存在");  
    44.     }  
    45. }







    1. 简介



    提供基于spring实现文件(笔记附件)的上传和下载的完整方案。方案将文件上传,并将文件名称作为字段与关联的笔记绑定在一起,更新笔记在数据库中的记录。显示笔记时,根据笔记所绑定的文件名生成下载路径,提交给服务端完成下载。



    2. 文件上传

    2. 1 前端



    在html中插入一个表单用于提交文件



    [html] view plain copy


    1. <form id= "uploadForm">
    2. <input type="file" name="file" id="file"/>
    3. <input type="button" id="upload" value="上传附件"/>
    4. </form>


    编写js给button单击事件,发送ajax请求,将文件数据上传给服务端,服务端返回存储的真实文件名,将文件名绑定在笔记元素上,在保存笔记时,将文件名写入相应笔记的数据库记录中。


    [javascript] view plain copy


    1. //给上传文件按钮绑定事件
    2. "#upload").click(uploadFile);


    [javascript] view plain copy


    1. function
    2. //获得上传文件
    3.     $.ajax({  
    4. 'file/upload.do',  
    5. 'POST',  
    6. false,  
    7. new FormData($('#uploadForm')[0]),  
    8. false,  
    9. false,  
    10. function(result){  
    11. var $checkedLi = $("#note_list li a.checked").parent();  
    12. "attachment",result.data);  
    13. "上传成功"+result.data);  
    14.         }  
    15.     });   
    16. }


    1. 2 后端



    采用CommonsMultipartResolver,需要导入commons-fileupload-1.2.1.jar和commons-io-1.3.2.jar,sc是ServletContext的引用,用实现ServletContextAware接口的方式获得。



    [java] view plain copy


    1. public JsonResult upload(HttpServletRequest request,HttpServletResponse response) throws
    2. new
    3. try{  
    4. "utf-8");  
    5. //创建一个通用的多部分解析器
    6. new
    7. //判断 request 是否有文件上传,即多部分请求
    8. if(multipartResolver.isMultipart(request)){  
    9. //转换成多部分request  
    10.             MultipartHttpServletRequest multiRequest =           
    11.                     multipartResolver.resolveMultipart(request);  
    12. //取得request中的所有文件名
    13.             Iterator<String> iter = multiRequest.getFileNames();  
    14. while(iter.hasNext()){  
    15. //取得上传文件
    16.                 MultipartFile file = multiRequest.getFile(iter.next());  
    17. if(file != null){  
    18. //取得当前上传文件的文件名称
    19.                     String myFileName = file.getOriginalFilename();  
    20. //如果名称不为“”,说明该文件存在,否则说明该文件不存在
    21. if(myFileName.trim() !=""){  
    22. //重命名上传后的文件名
    23.                         String fileName = file.getOriginalFilename();  
    24. //定义上传路径
    25. "/WEB-INF/files/");  
    26. new
    27. if(!dir.exists()){  
    28.                             dir.mkdirs();  
    29.                         }  
    30. new File(dir, NoteUtil.creatId().substring(30)+"-"+fileName);  
    31.                         file.transferTo(localFile);  
    32. //结果绑定文件路径
    33. 0);  
    34.                         result.setData(localFile.getName());  
    35. "上传成功");  
    36.                     }  
    37.                 }  
    38.             }  
    39.         }  
    40.   
    41. catch(Exception e){  
    42.         e.printStackTrace();  
    43. throw
    44.     }  
    45. 1);  
    46. return
    47. }


    2. 文件下载



    2. 1 前端



    由于get请求存在中文编码异常的问题,所以采用post请求,首先获取元素中绑定的文件名,生成一个表单



    [javascript] view plain copy


    1. if(attachment!=null){  
    2. var form_str = '<form action="file/download.do" method="post">'+  
    3. '<input type="hidden" name="fileName" value="'+attachment+'"></input>'+  
    4. '<input type="submit" value="下载附件"></input>'+  
    5. '</form>';  
    6. "#download_attachment").html(form_str);  
    7. }


    2. 2 后端



    后端需要解决中文文件名无法正常显示的问题,采用ISO8859-1字符集



    [java] view plain copy


    1. public void download(HttpServletResponse response, String fileName) throws
    2.     System.out.println(fileName);  
    3. "/WEB-INF/files/"+fileName;  
    4.     String fileFullPath = sc.getRealPath(filePath);  
    5. new
    6. if(file.exists()){  
    7. //重置response
    8.         response.reset();  
    9. "utf-8");  
    10. "text/html;charset=utf-8");  
    11. //设置http头信息的内容
    12. /           response.addHeader("Content-Disposition", "attachment;filename=\""+fileName+"\"");  
    13. //解决中文文件名显示问题
    14. "Content-Disposition", "attachment;filename="+new String(fileName.getBytes("gb2312"),"ISO8859-1"));  
    15. //设置文件长度
    16. int fileLength = (int)file.length();  
    17.         response.setContentLength(fileLength);  
    18.           
    19. if(fileLength!=0){  
    20. new
    21. byte[] buf = new byte[4096];  
    22.               
    23. //创建输出流
    24.             ServletOutputStream servletOS = response.getOutputStream();  
    25. int
    26.               
    27. //读取文件内容并写入到response的输出流当中
    28. while((readLength = inStream.read(buf))!=-1){  
    29. 0, readLength);  
    30.             }  
    31. //关闭输入流
    32.             inStream.close();  
    33.               
    34. //刷新输出流缓冲
    35.             servletOS.flush();  
    36.               
    37. //关闭输出流
    38.             servletOS.close();  
    39.         }  
    40. else{  
    41. "text/html;charset=utf-8");  
    42.         PrintWriter out = response.getWriter();  
    43. "文件\""+fileName + "\"不存在");  
    44.     }  
    45. }