jQuery File Upload 与SpringMVC结合

jQuery File Upload包含了一堆文件，首先需要弄清楚的是最核心的部分是哪些，根据官方的例子可以知道，一个最简单的jQuery File Upload上传组件，必须包括以下文件：

• jQuery核心库，建议使用jQuery 1.8以上版本
• js/vendor/jquery.ui.widget.js ： jQuery UI Widget
• js/jquery.iframe-transport.js ： 扩展iframe数据传输
• js/jquery.fileupload.js ： jQuery File Upload核心类
• js/cors/jquery.xdr-transport.js 在IE下应载入此文件解决跨域问题

此时只需要加载一个上传按钮

<input id="fileupload" type="file" name="attch" data-url="server/php/" multiple> 

以及一行代码

$('#fileupload').fileupload();  

就完成了一个最基本的上传组件。这个最简单的上传组件可以将选中的文件以表单形式提交到data-url约定的URL，同时提供了足够多的 设置和基础事件 可供扩展。

 

对于后台，需要增加SpringMVC对上传的支持，在springcontext.xml中增加配置

<bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver"/>

若采用Maven管理，则需要添加如下引用

<dependency>
	<groupId>commons-fileupload</groupId>
	<artifactId>commons-fileupload</artifactId>
	<version>1.3</version>
</dependency>	

在Controller中如下获取上传来的文件

@RequestMapping(value = "/upload/{adId}",method = RequestMethod.POST)
	public @ResponseBody String upload(@RequestParam(value = "file", required = false) MultipartFile file,@PathVariable String adId) {

			File f=new File(AD_PICTURES_LOCATION+adId+"/"+file.getOriginalFilename());
			try {
				FileUtils.copyInputStreamToFile(file.getInputStream(),f );
			} catch (IOException e) {
				e.printStackTrace();
			}
			 
			return "fileuploaddone";  

	}