springmvc異步上傳文件


前提條件

注意:bean的id名不能改變

<!-- 上傳文件攔截,設置最大上傳文件大小   10M=10*1024*1024(B)=10485760 bytes -->  
    <bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
        <property name="maxUploadSize" value="10485760" />
        <!--<property name="resolveLazily" value="true"/>-->
    </bean>

 

前台頁面upload.jsp

 

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script src="${pageContext.request.contextPath }/static/jquery/jquery-1.9.1.min.js"></script>
    <script type="text/javascript" src="${pageContext.request.contextPath }/static/jquery/jquery.form.js"></script>
    <script type="text/javascript">
   		//這種方式,可以異步請求數據,但是不能異步上傳文件
   		/*使用這種方式,會在后台拋出一個異常:
   			org.springframework.web.multipart.MultipartException: 
   				The current request is not a multipart request
   		*/
   		function doUpload(){
   			$.ajax({  
   			     url : "getParamFromFile",  
   			     type : "POST",  
   			     data : $('#postForm').serialize(),  
   			     success : function(data) {  
   			          $( '#messageTip').html(data);
   			          $( '#messageTip').show();
   			     },  
   			     error : function(data) {  
   			          $( '#messageTip').html(data);
   			          $( '#messageTip').show();
   			     }  
   			}); 
   		} 
   		
   		//使用jquery.form.js的表單插件來提交表單,這個可以異步上傳文件
   		/* function doUpload(){
   	   	    var options = {
   	   	    	url: 'getParamFromFileForAjax',//表單提交的地址。缺省值: 表單的action的值
   	   	    	type: 'POST',
   	   	    	dataType:'text',
   	   	    	data :{
					fileName : 'uploadFile'   	   	    		
   	   	    	},
   	   	  		//clearForm: true,//成功提交后,清除所有表單元素的值
   	   	  		//timeout: 3000 ,//限制請求的時間,當請求大於3秒后,跳出請求
   	   	  		// 從服務傳過來的數據顯示在這個div內部也就是ajax局部刷新
   	   	    	//target: '#output1',
   	   	 		
   	   	  		// 處理之后的處理
   	   	  		success: function(data){
   	   	  			alert(data);
   	   	  			var result = $.parseJSON(data);
   	   	  			alert(result);
   	   	  		}
   	   	 	};
   	   	    
   	   	    //使用jquery的ajax upload插件可以上傳文件
	   	   	$('#postForm').ajaxSubmit(options);
   		} */
    </script>
</head>
<body>
    <form id="postForm" action="getParamFromFile" method="post" 
		enctype="multipart/form-data">
	                上傳XML模版文件:<input type="file" name="uploadFile"/>
	                <input type="submit" value="上傳"/>
	      <input type="button" value="獲取Json參數數據" onclick="doUpload()"/>
	      <span id="messageTip" hidden="true"></span>
   	</form>
</body>
</html>

 

 

后台Controller代碼

//這種是使用傳統的form表單提交的,即在前台頁面上點擊‘上傳’按鈕上傳文件的形式,
//而且在form標簽上必須指定enctype="multipart/form-data"
@RequestMapping(value = "getParamFromFile",method = RequestMethod.POST) @ResponseBody public Map<String, Object> getParamFromFile(@RequestParam("uploadFile") MultipartFile uploadFile,HttpServletRequest request, HttpServletResponse response) { Map<String, Object> paramMap = new LinkedHashMap<String, Object>(); FileInputStream inputStream = null; try{ String filename = uploadFile.getName(); String originalFilename = uploadFile.getOriginalFilename(); System.out.println("FileName = " + filename); System.out.println("originalFilename = " + originalFilename); inputStream = (FileInputStream) uploadFile.getInputStream(); } catch (IOException e1) { paramMap.put("message", "上傳文件錯誤"); return paramMap; } //String filePath = "E:\\work\\svn\\openeap\\code\\openeap\\src\\main\\webapp\\template\\北京市房屋租賃合同5.xml"; //paramMap = ImportFile.getParamFromFile(filePath); paramMap = ImportFile.getParamFromStream(inputStream); Iterator it = paramMap.entrySet().iterator(); while (it.hasNext()) { Map.Entry e = (Map.Entry) it.next(); System.out.println("參數 Key: " + e.getKey() + "; 參數 Value: " + e.getValue()); } System.out.println("生成的json為: " + JsonMapper.getInstance().toJson(paramMap)); return paramMap; } //jQuery form插件的使用 后台 @RequestMapping(value = "getParamFromFileForAjax",method = RequestMethod.POST) @ResponseBody public Map<String, Object> getParamFromFileForAjax(HttpServletRequest request,String fileName) { Map<String, Object> paramMap = new LinkedHashMap<String, Object>(); FileInputStream inputStream = null; //把Request強轉成多部件請求對象 MultipartHttpServletRequest multipartHttpServletRequest = (MultipartHttpServletRequest) request; //根據文件名稱獲取文件對象 CommonsMultipartFile commonsMultipartFile = (CommonsMultipartFile) multipartHttpServletRequest.getFile(fileName); try{ String filename = commonsMultipartFile.getName(); String originalFilename = commonsMultipartFile.getOriginalFilename(); System.out.println("FileName = " + filename); System.out.println("originalFilename = " + originalFilename); inputStream = (FileInputStream) commonsMultipartFile.getInputStream(); } catch (IOException e1) { paramMap.put("message", "上傳文件錯誤"); return paramMap; } //String filePath = "E:\\work\\svn\\openeap\\code\\openeap\\src\\main\\webapp\\template\\北京市房屋租賃合同5.xml"; //paramMap = ImportFile.getParamFromFile(filePath); paramMap = ImportFile.getParamFromStream(inputStream); Iterator it = paramMap.entrySet().iterator(); while (it.hasNext()) { Map.Entry e = (Map.Entry) it.next(); System.out.println("參數 Key: " + e.getKey() + "; 參數 Value: " + e.getValue()); } System.out.println("生成的json為: " + JsonMapper.getInstance().toJson(paramMap)); return paramMap; }

  

  異步上傳文件有兩種方式:

  參考的文章:

    http://www.cnblogs.com/zhuxiaojie/p/4783939.html#autoid-1-0-0

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM