springMVC上傳檔案，MultipartHttpServletRequest、MultipartFile進行檔案上傳
阿新 • • 發佈：2018-10-31
這裡使用apache的開源jar包完成上傳功能，使用jar包分別是：common-fileupload.jar和common-io.jar
先編寫上傳檔案幫助類，如果需要區分檔案型別，可以將檔案字尾擷取進行判斷;
springmvc-mvc.xml配置，這裡主要配置springmvc解析器CommonsMultipartResolver等等，這裡主要是配置檔案上傳解析器，下面是配置檔案程式碼：
<?xml version="1.0" encoding="UTF-8"?> <beans xmlns="http://www.springframework.org/schema/beans" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:p="http://www.springframework.org/schema/p" xmlns:mvc="http://www.springframework.org/schema/mvc" xmlns:context="http://www.springframework.org/schema/context" xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans.xsd http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context.xsd http://www.springframework.org/schema/mvc http://www.springframework.org/schema/mvc/spring-mvc.xsd"> <!-- 自動掃描該包，使SpringMVC認為包下用了@controller註解的類是控制器 --> <context:component-scan base-package="com.cw.cashier.controller.*" /> <!--避免IE執行AJAX時，返回JSON出現下載檔案 --> <bean id="mappingJacksonHttpMessageConverter" class="org.springframework.http.converter.json.MappingJackson2HttpMessageConverter"> <property name="supportedMediaTypes"> <list> <value>text/html;charset=UTF-8</value> </list> </property> </bean> <!-- 使用註解 --> <mvc:annotation-driven> <mvc:message-converters> <bean class="org.springframework.http.converter.StringHttpMessageConverter" /> <bean class="org.springframework.http.converter.json.MappingJackson2HttpMessageConverter" /> </mvc:message-converters> </mvc:annotation-driven> <!-- 不處理靜態資源 --> <mvc:default-servlet-handler /> <!-- 上傳檔案時需要用到的分解層，預設將編碼轉為urf-8,設定最大上傳容量 ,最大記憶體--> <bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver"> <property name="defaultEncoding" value="UTF-8" /> <property name="maxUploadSize" value="102400000" /> <property name="maxInMemorySize" value="4096" /> </bean> <!-- 對模型檢視名稱的解析，即在模型檢視名稱新增前後綴 --> <bean class="org.springframework.web.servlet.view.InternalResourceViewResolver" id="internalResourceViewResolver"> <property name="prefix" value="/WEB-INF/view/" /> <property name="suffix" value=".jsp" /> </bean> </beans>
編寫檔案上傳幫助類
注意：檔案上傳時，會有上傳多個檔案的功能，所以檔案上傳幫助類方法可以寫成返回 List 集合，
這樣就可以基本滿足單個和多個檔案上傳使用，不多說了，上程式碼：
/** * 上傳檔案幫助類 * * @author ajie * */ public class FileUploadUtil { // 使用日誌工廠獲取日誌物件 private static Log log = LogFactory.getLog(FileUploadUtil.class); /** * 批量上傳檔案 * * @param request * @param response * @param username * 使用者名稱; 用於區分使用者上傳的圖片 * @param moduleName * 模組名稱; 用於區分該圖片是位於那個模組進行上傳 * @return * @throws FileNotFoundException */ public static List<String> uploadFile(HttpServletRequest request, String username, String moduleName) throws FileNotFoundException { // 建立list集合，用於接收上傳檔案的路徑 List<String> filePathList = new ArrayList<String>(); // 拼接檔案上傳位置，這裡使用Tomcat伺服器，將檔案上傳到webapps中，和專案同目錄，files將用於儲存上傳的檔案，將上傳的檔案於專案分開 String strPath = ",webapps,files," + moduleName + "," + username; // 解析出檔案存放路徑位置 String filepath = System.getProperty("catalina.base") + strPath.replace(',', File.separatorChar); log.debug("檔案上傳路勁位置-------->>>>>>>>>>>>" + filepath); // 轉換request，解析出request中的檔案 MultipartHttpServletRequest multipartRequest = (MultipartHttpServletRequest) request; // 獲取檔案map集合 Map<String, MultipartFile> fileMap = multipartRequest.getFileMap(); String fileName = null; // 迴圈遍歷，取出單個檔案 for (Map.Entry<String, MultipartFile> entity : fileMap.entrySet()) { // 獲取單個檔案 MultipartFile mf = entity.getValue(); // 獲得原始檔名 fileName = mf.getOriginalFilename(); // 擷取檔案型別; 這裡可以根據檔案型別進行判斷 String fileType = fileName.substring(fileName.lastIndexOf('.')); try { // 擷取上傳的檔名稱 String newFileName = fileName.substring(0, fileName.lastIndexOf('.')); log.debug("上傳來的檔名稱------->>>>>>>>>" + newFileName); // 拼接上傳檔案位置 String newfilePath = filepath + File.separatorChar + newFileName + fileType; log.debug("拼接好的檔案路徑地址------------->>>>>>>>" + newfilePath); // 重新組裝檔案路徑，用於儲存在list集合中 String filepathUrl = "files" + File.separatorChar + moduleName + File.separatorChar + username + File.separatorChar + newFileName + fileType; log.debug("檔案位置---------------->>>>>>>>>>" + filepathUrl); // 建立檔案存放路徑例項 File dest = new File(filepath); // 判斷資料夾不存在就建立 if (!dest.exists()) { dest.mkdirs(); } // 建立檔案例項 File uploadFile = new File(newfilePath); // 判斷檔案已經存在，則刪除該檔案 if (uploadFile.exists()) { uploadFile.delete(); } log.debug("start upload file-------------->>>>>>> " + fileName); // 利於spring中的FileCopyUtils.copy()將檔案複製 FileCopyUtils.copy(mf.getBytes(), uploadFile); // 將檔案路徑存入list集合中 filePathList.add(filepathUrl); } catch (IOException e) { // TODO Auto-generated catch block e.printStackTrace(); log.error("upload failed. filename: " + fileName+"---->>>error message ----->>>>> "+ e.getMessage()); return null; } } return filePathList; } }
編寫檔案上傳controller控制器
/** * 單個、批量檔案上傳 * * @param request * @param response * @param session * @param module * 獲取傳入的模組名稱 * @return */ @RequestMapping(value = "/secure/upload-file/{module}", method = RequestMethod.POST, produces = "application/json;charset=UTF-8") public String uploadFiles(Model model,HttpServletRequest request, HttpSession session, @PathVariable("module") String module) { // 獲取session中儲存的使用者資訊 User user = (User) session.getAttribute("user"); // 建立list集合用於獲取檔案上傳返回路徑名 List<String> list = new ArrayList<String>(); try { // 獲取上傳完檔案返回的路徑,判斷module模組名稱是否為空，如果為空則給default作為資料夾名 list = FileUploadUtil.uploadFile(request, user.getUsername(), (module == null || module.length() == 0) ? "default" : module); // model屬性也行 model.addAttribute("fileUrlList", list); } catch (Exception e) { // TODO: handle exception e.printStackTrace(); LOG.error("上傳檔案發生錯誤=》》" + e.getMessage()); } // 轉發到uploadTest.jsp頁面 return "uploadTest"; } /** * 跳轉至檔案上傳頁面 * * @return */ @RequestMapping(value = "/common/upload-page", method = RequestMethod.GET) public String uploadTestPage() { return "uploadTest"; }
編寫檔案上傳uploadTest.jsp頁面
這裡使用兩種方式上傳圖片，ajax上傳使用者體驗更好，可以給出相應的提示給使用者
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
+ path + "/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<base href="<%=basePath%>" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript"
src="<%=basePath%>statics/js/jquery/jquery-1.9.0.min.js"></script>
<script type="text/javascript">
var util = {
basePath : function basePath() {// 返回專案路徑
var context = document.getElementsByTagName('base')[0].href;
return context;
},
file_upload : function file_upload() {
// 建立表單資料物件
var obj = new FormData();
// 獲取檔案框中的資料
var file1 = document.getElementById("file1").files[0];
var file2 = document.getElementById("file2").files[0];
// 將檔案資料新增至表單資料物件中
obj.append("file1", file1);
obj.append("file2", file2);
console.log("請求引數---》》》" + obj);
// 使用ajax非同步檔案上傳
$.ajax({
url : util.basePath() + 'secure/upload-file/uploadDemo',
type : 'POST',
data : obj,
contentType : false,
processData : false,
mimeType : 'multipart/form-data',
success : function(data) {
console.log(data);
}
})
}
}
</script>
</head>
<body>
<!-- 使用post表單提交，設定型別為：multipart/form-data -->
<form action="<%=basePath%>secure/upload-file/uploadDemo"
enctype="multipart/form-data" method="POST">
<h2>基本form表單上傳檔案</h2>
檔案一：<input type="file" name="file1" /><br /> 檔案二：<input type="file"
name="file2" /><br /> <input type="submit" value="提交" />
</form>
<!-- 使用ajax上傳檔案方式 -->
<div>
<h3>ajax上傳檔案</h3>
檔案一：<input type="file" id="file1" /><br /> 檔案二：<input type="file"
id="file2" /><br /> <input type="button"
onclick="util.file_upload()" value="上傳提交">
</div>
<!-- 迴圈遍歷出圖片 -->
<c:forEach items="${fileUrlList}" var="item">
<img style="width:200px;height:200px" src="http://localhost:8080/${item}">
</c:forEach>
</body>
</html>ajax方式可以自己更改，根據使用情況修改，控制器這裡為了方便檢視效果，所以返回的是jsp頁面，
實際使用情況為返回資料，給予前臺上傳檔案後的提示，將圖片即時顯示在頁面上
執行效果如下：
form表單上傳檔案效果圖—-》》》》
ajax上傳檔案效果圖，這裡可以看見console瀏覽器控制檯輸出的資料——-》》》》》
(中智軟體科技學校)