SSM在一个表单中同时上传多个文件

在pom.xml中引入依赖配置

<!-- 文件上传 -->
		<dependency>
			<groupId>commons-fileupload</groupId>
			<artifactId>commons-fileupload</artifactId>
			<version>1.3.2</version>
		</dependency>
		<dependency>
			<groupId>commons-io</groupId>
			<artifactId>commons-io</artifactId>
			<version>2.5</version>
		</dependency>

在springMVC配置文件中添加如下配置

<!-- springMVC文件上传 -->
	<!-- 定义文件上传解析器 --><bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
   <property name="defaultEncoding">
      <value>UTF-8</value>
   </property>
   <property name="maxUploadSize">
      <value>32505856</value><!-- 上传文件大小限制为31M，31*1024*1024 -->
   </property>
   <property name="maxInMemorySize">
      <value>4096</value>
   </property>
   </bean>

Jsp页面表单：
在onclick方法中传入上传文件序号，从0开始，表示上传组件在Martipart[]数组中的序号

<form action="<%=editMemberUrl%>" id="myform" method="post"
		enctype="multipart/form-data" class="form-horizontal">

		<div class="form-group" id="passwordDiv">
			<label class="col-md-2 control-label" for="password">上传图像：</label>
			<div class="col-md-5">
				<input class="" type="file" name="file" /> <input type="hidden"
					name="pic1" id="coverImg1" value="${member.pic1 }" /> <input
					type="button" value="上传" onclick="**upload(0)**" /> <img
					id="coverImg2" src="${member.pic1 }"
					style="width: 50px; height: 50px;" />
			</div>
		</div>
		<div class="form-group" id="passwordDiv">
			<label class="col-md-2 control-label" for="password">上传图像：</label>
			<div class="col-md-5">
				<input class="" type="file" name="file" /> <input type="hidden"
					name="pic2" id="infoImg1" value="${member.pic2 }" /> <input
					type="button" value="上传" onclick="**upload(1)**" /> <img id="infoImg2"
					src="${member.pic2}" style="width: 50px; height: 50px;" />
			</div>
		</div>
	</form>

使用jstl标签：

<c:set var="ctx"  value="${pageContext.request.contextPath }"/>

添加ajax请求

<script>		
		//id为上传控件的序号，从0开始
		function upload(id) {
			alert("开始上传文件！")
			var formData = new FormData(document.getElementById("myform"));

			$.ajax({
				//通过可变参数，传递多个文件上传对象，id从0开始
				url : "${ctx}/file/upload2/" + id + ".html",
				type : "post",
				data : formData,
				processData : false,
				contentType : false,
				success : function(data) {
					if (data != "0") {
						alert("上传成功:" + data);
						if (id == 0) {
							$('#coverImg1').val(data);
							$('#coverImg2').attr("src", "${ctx}/" + data);
						} else if (id == 1) {
							$('#infoImg1').val(data);
							$('#infoImg2').attr("src", "${ctx}/" + data);
						}
					} else {
						alert("上传失败")
					}
				}
			});
		}
	</script>

添加java代码：

@Controller
@RequestMapping("/file")
public class FileUploadController {
//json方式文件上传，上传多个文件，根据id从0开始，代表多个文件数组对象元素,返回json串
	@RequestMapping("/upload2/{id}")
	@ResponseBody
	public String upLoad2(HttpServletRequest request, @PathVariable("id") int id, @RequestParam("file") MultipartFile[] upfile)
			throws IllegalStateException, IOException {
		
			//System.out.println("json文件上传" + upfile[id]);
			System.out.println("json文件上传");
			if (!upfile[id].isEmpty()) {
				// 获取上传文件路径
				String path = request.getSession().getServletContext().getRealPath("/upload");
				System.out.println("json文件上传路径：" + path);
				// 上传文件名
				String filename = upfile[id].getOriginalFilename();
				File filepath = new File(path, filename);
				System.out.println("json:"+filepath);
				// 将上传文件保存到一个目标文件当中
				upfile[id].transferTo(filepath);	
				System.out.println("文件上传完成！");
				// 保存文件信息
				request.setAttribute("file", "upload" + File.separator + filename);
				return "upload" + File.separator + filename;
			}else {
				return "0";
			}
	}
}