SpringMVCはajaxfileupladファイルと合わせて更新なしでアップロードします.


jQueryはajaxのファイルアップロードを提供していません.ajaxfileupladを通じて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を使う時、まずajaxfileupladファイルをダウンロードして、対応する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
実は簡単です