Java Web使用Html5 FormData实现多文件上传功能

<form enctype="multipart/form-data" id="formfile"><input type="file" name="file"/></>

<input type="file" multiple="multiple" accept="image/gif, image/jpeg, image/png, image/jpg, image/bmp" />

$(document).on("change", ".upload-img input:file", function() { var fileId = $(this).attr("id"); var t_files = this.files; var imglength = $("#view_" + fileId).parent().parent().find(".upload-img").length; if (imglength==1) {  if (t_files.length > 5) {  new Message().showMsg("最多选择五张图片");  return false;  } else if (t_files.length < 1) {  new Message().showMsg("至少选择一张图片");  return false;  } }else if(t_files.length+imglength>6) {  new Message().showMsg('最多再选择'+ (6-parseInt(imglength)) +'张图片');  return false; } var data = new FormData(); for (var i=0;i<t_files.length;i++){  data.append('file',t_files[i]);  data.append('randomCode',fileId+i);  data.append('upDir','comment') }// for(var pair of data.entries()){//  console.log(pair);// }// console.log(JSON.stringify(data)); $.ajax({  url : '${pageContext.request.contextPath}/file/multipleCommentImageUpload', //用于文件上传的服务器端请求地址  type : 'post',  processData: false, // 告诉jQuery不要去处理发送的数据  contentType: false, // 告诉jQuery不要去设置Content-Type请求头  data:data,  cache: false }).done(function(data,status){  var dataObj = jQuery.parseJSON(data);  if(dataObj.state == -1){  new Message().showMsg("上传图片出错");  }else{  var imgs = dataObj.imgs;  for (var i=0;i<imgs.length;i++) {   var imgUrl = imgs[i].imageUrl;   var imglength = $("#view_" + fileId).parent().parent().find(".upload-img").length   if ( imglength < 5) {   $("#view_" + fileId).parent().after('<div class="upload-img"><img src="' + imgUrl + '"   $("#view_" + fileId).parent().nextAll().find('span').eq(0).text(parseInt($("#view_" + fileId).parent().nextAll().find('span').eq(0).text())+1);   $("#view_" + fileId).parent().nextAll().find('span').eq(1).text(5-parseInt($("#view_" + fileId).parent().nextAll().find('span').eq(0).text()));   }else{   $("#view_" + fileId).attr('src',imgUrl);   $("#view_" + fileId).nextAll().find('input').hide();   $("#view_" + fileId).parent().nextAll().remove('p');   }  }  } }).fail(function (res) {  //console.log("error") })

public void multipleCommentImageUpload(HttpServletRequest request, HttpServletResponse response, @RequestParam(value = "file", required = false)List<MultipartFile> files) { response.setContentType("text/html;charset=utf-8"); UserSession user = WebUtil.getSessionUser(request); for (MultipartFile file:files) {  String fileName = file.getOriginalFilename(); //获取文件名 } UploadMessage message = new UploadMessage(); Map map1 = new HashMap(); try {  Map<String,Object> map = this.multipleUpload(request, files);  }; protected Map<String,Object> multipleUpload(HttpServletRequest request, List<MultipartFile> files) throws IllegalStateException, IOException { Map<String,Object> map =new HashMap(); for(MultipartFile file:files) {  if (file == null) {  map.put("status",-1);  map.put("statusInfo","上传参数不能为空");  return map;  } } //创建一个通用的多部分解析器 CommonsMultipartResolver multipartResolver = new CommonsMultipartResolver(request.getSession().getServletContext()); //判断 request 是否有文件上传,即多部分请求 if (multipartResolver.isMultipart(request)) {  //转换成多部分request  MultipartHttpServletRequest multiRequest = (MultipartHttpServletRequest) request;  Enumeration params = multiRequest.getParameterNames();  String upDir = null;　　　　　　　　//获得formdata对象中自定义的一些属性,是枚举类型  while (params.hasMoreElements()) {  String name = (String)params.nextElement();  upDir = multiRequest.getParameter("upDir");  }  //取得request中的所有文件名  Iterator<String> iter = multiRequest.getFileNames();  List<Map> list = new ArrayList<>();  MultiValueMap<String, MultipartFile> multiValueMap = multiRequest.getMultiFileMap();  List<MultipartFile> fileList = multiValueMap.get("file");  for (MultipartFile file:fileList){  //这里上传多张图片  StringBuffer url = new StringBuffer("");  Map<String,String> map1 = new HashMap<>();  if (file != null) {   //取得当前上传文件的文件名称   String originalFilename = file.getOriginalFilename();   //如果名称不为“”,说明该文件存在，否则说明该文件不存在   if (originalFilename != null && originalFilename.trim() != "") {   String suffix = "";   if (originalFilename.indexOf(".") > -1) {    suffix = originalFilename.substring(originalFilename.lastIndexOf("."), originalFilename.length());   }   if (notImageFormat(suffix)) {    map.put("statusInfo",imageFomat);    return map;   }   if (isPassSize(file.getSize())) {    map.put("stateInfo",imageSize);    return map;   }   //重命名上传后的文件名   String fileName = idWorker.nextId() + suffix;   String dir = DateTimeUtil.formatDateTime("yy/MM/dd");   if (!StringUtils.isBlank(upDir)){    url.append("/").append( upDir);   }   url.append("/").append(dir).append("/");   //定义上传路径   String path = ParamUtil.imageServiceRealPath + url;   //上传图片   imageUploadService.uploadImage(path, fileName, file.getInputStream());   String allUrl = url + fileName;   map1.put("imagePath",url.toString());   map1.put("imageName",fileName);   map1.put("imageUrl",ParamUtil.imageServicePath + allUrl);   list.add(map1);   }  }  }  map.put("status",0);  map.put("statusInfo","success");  map.put("imgs",list); } return map; }