文件上传:Fileupload,AjaxFileUpload

简介:

方式一:利用commons下面的fileupload进行上传

步骤1:添加依赖

 
  1. <dependency> 
  2.         <groupId>com.alibaba.external</groupId> 
  3.         <artifactId>jakarta.commons.fileupload</artifactId> 
  4.         <version>1.2.1</version> 
  5.     </dependency> 

步骤2:在jsp页面中添加上传文件,使用enctype="multipart/form-data"

 
  1. <form method="post" action="/FileUploadServlet" enctype="multipart/form-data"> 
  2.         fileupload:<input name="filename" type="file"> <br> 
  3.         name:<input name="name" type="text" value="zhangsan"><br>  
  4.         <input name="sub" type="submit" value="提交"> 
  5.     </form> 

步骤3:在servlet中处理文件上传,参考官方文档:http://commons.apache.org/fileupload/using.html

 
  1. FileItemFactory factory = new DiskFileItemFactory(); 
  2. ServletFileUpload upload = new ServletFileUpload(factory); 
  3. try { 
  4.     List items = upload.parseRequest(request); 
  5.     Iterator iter = items.iterator(); 
  6.     while (iter.hasNext()) { 
  7.         FileItem item = (FileItem) iter.next(); 
  8.         if (item.isFormField()) { 
  9.             System.out.println("isFormField----" + item.getName()); 
  10.         } else { 
  11.             String fullPathName = item.getName(); 
  12.             String filename = this.getServletContext().getRealPath( 
  13.                     "upload"
  14.                     + File.separator 
  15.                     + new Date().getTime() 
  16.                     + fullPathName.substring(fullPathName 
  17.                             .lastIndexOf(".")); 
  18.             File file = new File(filename); 
  19.             try { 
  20.                 item.write(file); 
  21.             } catch (Exception e) { 
  22.                 e.printStackTrace(); 
  23.             } 
  24.         } 
  25.     } 
  26.     request.getRequestDispatcher("pages/s5_result.jsp").forward( 
  27.             request, response); 
  28. catch (FileUploadException e) { 
  29.     e.printStackTrace(); 

步骤4:在web.xml中添加servlet mapping

 
  1. <servlet> 
  2.     <servlet-name>FileUploadServlet</servlet-name> 
  3.     <servlet-class>com.alibaba.upload.FileUploadServlet</servlet-class> 
  4. </servlet> 
  5. <servlet-mapping> 
  6.     <servlet-name>FileUploadServlet</servlet-name> 
  7.     <url-pattern>/FileUploadServlet</url-pattern> 
  8. </servlet-mapping> 

方式2:使用jquery的ajaxfileupload插件怎么实现异步上传:AjaxFileUpload

页面代码:

 
  1. <html> 
  2.     <!-- 引入相关的js文件,相对路径  --> 
  3.     <script type="text/javascript" src="js/jquery.js"></script> 
  4.       <script type="text/javascript" src="js/ajaxfileupload.js"></script> 
  5.  
  6.     <!-- 执行上传文件操作的函数 --> 
  7.       <script type="text/javascript"> 
  8.           function ajaxFileUpload(){ 
  9.                $.ajaxFileUpload( 
  10.                    { 
  11.                 url:'update.do?method=uploader',            //需要链接到服务器地址 
  12.                 secureuri:false, 
  13.                 fileElementId:'houseMaps',                        //文件选择框的id属性 
  14.                 dataType: 'xml',                                     //服务器返回的格式,可以是json 
  15.                 success: function (data, status)            //相当于java中try语句块的用法 
  16.                 {       
  17.                     $('#result').html('添加成功'); 
  18.                 }, 
  19.                 error: function (data, status, e)            //相当于java中catch语句块的用法 
  20.                 { 
  21.                     $('#result').html('添加失败'); 
  22.                 } 
  23.             } 
  24.                     
  25.                ); 
  26.                
  27.           } 
  28.       </script> 
  29.   </head> 
  30.    
  31.   <body> 
  32.       <form method="post" action="update.do?method=uploader" enctype="multipart/form-data">   
  33.         <input type="file" id="houseMaps" name="houseMaps"/>  
  34.         <input type="button" value="提交" onclick="ajaxFileUpload()"/> 
  35.     </form>  
  36.     <div id="result"></div> 
  37.      
  38.   </body> 
  39. </html> 

 

服务器代码:

 
  1. public class UpdateAction extends DispatchAction { 
  2.  
  3.     public ActionForward uploader(ActionMapping mapping, ActionForm form, 
  4.             HttpServletRequest request, HttpServletResponse response) { 
  5.         UpFormForm upFormForm = (UpFormForm) form; 
  6.         FormFile ff = upFormForm.getHouseMaps(); 
  7.         try { 
  8.             InputStream is = ff.getInputStream(); 
  9.             File file = new File("D:/" + ff.getFileName());            //指定文件存储的路径和文件名 
  10.             OutputStream os = new FileOutputStream(file); 
  11.              
  12.             byte[] b = new byte[1024]; 
  13.             int len = 0
  14.             while((len = is.read(b)) != -1){ 
  15.                 os.write(b, 0, len); 
  16.             } 
  17.             os.close(); 
  18.             is.close(); 
  19.         } catch (Exception e) { 
  20.             e.printStackTrace(); 
  21.              
  22.         } 
  23.          
  24.         return null
  25.     } 



 本文转自 tianya23 51CTO博客,原文链接:http://blog.51cto.com/tianya23/678115,如需转载请自行联系原作者

相关文章
|
5月前
|
JavaScript 前端开发
Element_文件上传&&多个文件上传
Element_文件上传&&多个文件上传
132 0
|
5月前
|
前端开发 JavaScript 数据处理
ajax Fileupload多文件上传实现
【5月更文挑战第3天】使用jQuery和AjaxFileUpload.js,实现多文件上传的示例。HTML部分包括一个文件输入框和上传按钮。JavaScript部分在按钮点击时获取文件,创建FormData对象并遍历文件添加进去。然后通过Ajax以POST方式发送至&#39;upload.php&#39;,设置禁用jQuery的数据处理和contentType自动设置。成功或失败后有相应回调处理服务器响应或错误。
61 5
|
11月前
|
前端开发 JavaScript
ajax Fileupload多文件上传实现案例
ajax Fileupload多文件上传实现案例
111 1
|
5月前
uploadify组件文件上传那些事
uploadify组件文件上传那些事
60 0
|
NoSQL
OkhttpUtils单、多文件上传
OkhttpUtils单文件上传
570 0
|
缓存 Java Apache
Struts2实现单文件上传,多文件上传与下载(十)上
Struts2实现单文件上传,多文件上传与下载(十)
244 0
Struts2实现单文件上传,多文件上传与下载(十)上
Struts2实现单文件上传,多文件上传与下载(十)下
Struts2实现单文件上传,多文件上传与下载(十)
212 0
Struts2实现单文件上传,多文件上传与下载(十)下
|
前端开发 应用服务中间件
Struts2实现单文件上传,多文件上传与下载(十)中
Struts2实现单文件上传,多文件上传与下载(十)
102 0
Struts2实现单文件上传,多文件上传与下载(十)中