SpringMVC(四)上傳檔案、json資料互動

z1340954953發表於2018-06-12

上傳檔案

* tomcat中配置虛擬目錄

修改server.xml,在裡面新增

<Context docBase="D:\develop\upload\temp" path="/pic" reloadable="false"/>

這樣,就可以通過訪問http://localhost:8080/pic訪問到d盤下的檔案    

eclipse中設定


依賴jar


SpringMVC.xml中配置檔案上傳解析器

<!-- 檔案上傳,id必須設定為multipartResolver -->
<bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
	<!-- 設定檔案上傳大小 單位B 50M-->
	<property name="maxUploadSize" value="52428800" />
</bean>

jsp頁面修改

<form action="${pageContext.request.contextPath}/item/fileUpload.action"
		method="post" enctype="multipart/form-data">
		<input type="file" name="file"> <input type="submit"
			value="提交">
	</form>

enctype 必須改為 multipart/form-data

controller方法

@RequestMapping("/fileUpload.action")
	public String doFileUpload(@RequestParam(required = false) MultipartFile file,
			HttpServletRequest request
			) throws IllegalStateException, IOException{
		if(file==null){
			return "itemList";
		}
		String orginFileName = file.getOriginalFilename();
		String fileName = UUID.randomUUID()+""+orginFileName.substring(orginFileName.lastIndexOf("."));
		String path = request.getServletContext().getRealPath(File.separatorChar+"WEB-INF"+File.separatorChar+"upload");
		File file2 = new File(path, fileName);
		if(!file2.getParentFile().exists()){
			file2.getParentFile().mkdirs();
		}
		file.transferTo(file2);
		return "forward:/itemList.action";
	}

檔案路徑訪問不到的異常

因為父目錄不存在,加上file.getParentFile().mkdirs()建立父目錄解決

存放檔案的路徑說明

1. 直接在webRoot下建立upload資料夾,上傳檔案放在這裡,在瀏覽器上能夠直接訪問到,因此這裡存放是安全的

http://localhost:8081/goldSpringDemo/upload/0ea8aa64-76c6-49bf-9ecd-3a56c9fa87ed.xls

2. 在webRoot下的WEB-INF下建立upload資料夾,將上傳檔案放在這裡,瀏覽器無法直接訪問到,這裡比較安全

,本例中用的就是這種

多檔案上傳

修改jsp頁面

<form action="${pageContext.request.contextPath}/item/fileUploads.action"
		method="post" enctype="multipart/form-data">
		<input type="file" name="files"> 
		<input type="file" name="files"> 
		<input type="file" name="files"> 
		<input type="submit" value="提交">
	</form>

修改controller方法形參,遍歷後按照單個檔案的處理流程處理就是

@RequestMapping("/fileUploads.action")
	public String doFileUploads(@RequestParam(required = false) List<MultipartFile> files,
			HttpServletRequest request
			) throws IllegalStateException, IOException{
		if(files==null){
			return "itemList";
		}
		for(int i = 0;i<files.size();i++){
			MultipartFile file = files.get(i);
			String orginFileName = file.getOriginalFilename();
			String fileName = UUID.randomUUID()+""+orginFileName.substring(orginFileName.lastIndexOf("."));
			String path = request.getServletContext().getRealPath(File.separatorChar+"WEB-INF"+File.separatorChar+"upload");
			File file2 = new File(path, fileName);
			if(!file2.getParentFile().exists()){
				file2.getParentFile().mkdirs();
			}
			file.transferTo(file2);
		}
		return "forward:/item/itemList.action";
	}

Json資料互動

@RequestBody註解將請求的json資料轉為java物件進行繫結

@ResponseBody將controller方法返回的java物件轉為json響應客戶端。

jar支援


JSON轉換器

如果xml中使用註解驅動<mvc:annotation-driven/>,不需要配置json轉換器,不適用註解驅動就需要配置

<!--處理器介面卡 -->
	<bean class="org.springframework.web.servlet.mvc.method.annotation.RequestMappingHandlerAdapter">
		<property name="messageConverters">
		<list>
		<bean class="org.springframework.http.converter.json.MappingJacksonHttpMessageConverter"></bean>
		</list>
		</property>
	</bean>

開始測試下:

jsp頁面:

<script type="text/javascript">	
	//live 能夠對還沒有新增進DOM的元素有效,jquery 1.7後使用on替換
		$("#bt").live("click",function(){
			$.ajax({
				type:'GET',
				url:contentpath+'/item/json.action',
				data:$("#form1").serialize(),
				contentType:"application/x-www-form-urlencoded;charset=utf-8",
				dataType:'json',
				success:function(data){
					console.log(data);
				},
				error:function(){
					alert('伺服器連線失敗,請重試!');
				}
				
			});		
		});
	</script>
	<form action="" id="form1">
	<table>
		<tr>
			<td>編號</td>
			<td>
				<input type="text" name="item.id">
			</td>
		</tr>
		<tr>
			<td>名稱</td>
			<td>
				<input type="text" name="item.name">
			</td>
		</tr>
		<tr>
			<td>時間</td>
			<td>
				<input type="text" name="item.time">
			</td>
		</tr>
		<tr>
			<td>備註</td>
			<td>
				<input type="text" name="item.remark">
			</td>
		</tr>
		<tr>
			<td>
				<input id="bt" type="button" value="ajax提交">
			</td>
		</tr>
	</table>
	</form>

controller方法

@RequestMapping("/json.action")
	public @ResponseBody Item dojsonSupport(QueryVo qv){
		return qv.getItem();
	}

相關文章