SpringMVC結合ajaxfileupload檔案無重新整理上傳，ajaxspringmvc

SpringMVC結合ajaxfileupload檔案無重新整理上傳，ajaxspringmvc

          jQuery沒有提供ajax的檔案上傳，我們可以通過ajaxfileupload實現ajax檔案的上傳。其實ajaxfileupload檔案上傳特別的簡單。下面就示範一下在SpringMVC中實現ajax的檔案上傳。

      1、後台接收代碼

     首先在spring的設定檔中添加檔案上傳配置

     

       <!-- 檔案上傳 --><bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver"><property name="defaultEncoding" value="UTF-8"/>  </bean>

    再寫檔案接收的代碼

       

package org.andy.controller;import java.io.File;import java.io.IOException;import java.util.Arrays;import java.util.Date;import java.util.HashMap;import javax.servlet.ServletContext;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse;import org.apache.commons.fileupload.servlet.ServletFileUpload;import org.apache.log4j.Logger;import org.springframework.stereotype.Controller;import org.springframework.web.bind.annotation.RequestMapping;import org.springframework.web.bind.annotation.RequestMethod;import org.springframework.web.bind.annotation.RequestParam;import org.springframework.web.multipart.commons.CommonsMultipartFile;@Controller@RequestMapping("/upload")public class UploadController {private static final Logger LOG = Logger.getLogger(UploadController.class);private static final HashMap<String, String> TypeMap = new HashMap<String, String>();static {TypeMap.put("image", "gif,jpg,jpeg,png,bmp");TypeMap.put("flash", "swf,flv");TypeMap.put("media", "swf,flv,mp3,wav,wma,wmv,mid,avi,mpg,asf,rm,rmvb");TypeMap.put("file", "doc,docx,xls,xlsx,ppt,pptx,htm,html,txt,dwg,pdf");}/** * 檔案上傳 之 圖片上傳 *  * @param file * @param request * @return message: -1 沒有檔案上傳 0 上傳成功 1 上傳失敗 2 檔案超過上傳大小 3 檔案格式錯誤 4 上傳檔案路徑非法 5 上傳目錄沒有寫入權限 *        *  */@RequestMapping(value = "/imageUpload", method = RequestMethod.POST)public void imageUpload(@RequestParam("file") CommonsMultipartFile file,@RequestParam(required = false) String filePre, HttpServletRequest request, HttpServletResponse response) {LOG.info("file name is :" + file.getOriginalFilename());if (!file.isEmpty()) {ServletContext servletContext = request.getSession().getServletContext();String uploadPath = servletContext.getRealPath("/")+ "uploadImage/";// 檔案上傳大小long fileSize = 3 * 1024 * 1024;if (file.getSize() > fileSize) {backInfo(response, false, 2, "");return;}String OriginalFilename = file.getOriginalFilename();String fileSuffix = OriginalFilename.substring(OriginalFilename.lastIndexOf(".") + 1).toLowerCase();if (!Arrays.asList(TypeMap.get("image").split(",")).contains(fileSuffix)) {backInfo(response, false, 3, "");return;}if (!ServletFileUpload.isMultipartContent(request)) {backInfo(response, false, -1, "");return;}// 檢查上傳檔案的目錄File uploadDir = new File(uploadPath);if (!uploadDir.isDirectory()) {if (!uploadDir.mkdir()) {backInfo(response, false, 4, "");return;}}// 是否有上傳的許可權if (!uploadDir.canWrite()) {backInfo(response, false, 5, "");return;}//新檔案名稱String newname = "";if(null != filePre){newname += filePre;//對應模組上傳的檔案名稱首碼} newname +=DateFormater.format(new Date(),DateFormater.DATETIME_PATTERN) + "." + fileSuffix;File saveFile = new File(uploadPath, newname);try {file.transferTo(saveFile);backInfo(response, true, 0, newname);} catch (Exception e) {LOG.error(e.getMessage(), e);backInfo(response, false, 1, "");return;}} else {backInfo(response, false, -1, "");return;}}// 返回資訊private void backInfo(HttpServletResponse response, boolean flag, int message,String fileName) {String json  = "";if (flag) {json = "{ \"status\": \"success"; } else {json = "{ \"status\": \"error"; }json += "\",\"fileName\": \"" + fileName + "\",\"message\": \"" + message + "\"}";try {response.setContentType("text/html;charset=utf-8");response.getWriter().write(json);} catch (IOException e) {LOG.error(e.getMessage(), e);}}}

         2、前台接受代碼

          使用ajaxfileupload時，首先下載ajaxfileupload檔案，匯入對應的js檔案

    

      <script type="text/javascript" src="js/ajaxfileupload.js"></script>

       檔案傳輸欄位必須為file類型，如下：

       <input type="file" id="file" name="file" onchange="ajaxFileUpload();"/>

      其次，處理上傳檔案：

           

            //ajax 實現檔案上傳 function ajaxFileUpload() {$.ajaxFileUpload({url : "upload/imageUpload.shtml",secureuri : false,data : {filePre : "feedback",p : new Date()},fileElementId : "file",dataType : "json",success : function(data) {if (data.status == "success") {//上傳成功}switch(data.message){ //解析上傳狀態case "0" : //上傳成功           break;case "-1" : //上傳檔案不可為空          break;default: //上傳失敗     break;}},error : function(data) {//上傳失敗}});}

本文出處：http://blog.csdn.net/fengshizty

其實很簡單。