input file multiple 配合springmvc实现多文件上传

来源:互联网 发布:上海地铁免费查询软件 编辑:程序博客网 时间:2024/05/22 17:15

1、前端页面的样子

<input id="file" name="file" type="file" multiple="multiple"  />

2、前端的js代码

var formData = new FormData(); var files = $("#file")[0].files;for(var i = 0 ; i < files.length ; i ++){formData.append('file',files[i]);}
3、ajax的代码

$.ajax({   url: '${cpath}/biz/xxxx/addFile',    type: 'POST',    cache: false,    data: formData,    processData: false,    contentType: false}).done(function(res) {debugger;}); 

4、后端的代码

@RequestMapping(value = "addFile", method = RequestMethod.POST, produces = "application/json; charset=UTF-8")@ResponseBodypublic String addFile(HttpServletRequest request,HttpServletResponse response) {String rRoles = request.getParameter("rRoles");List<MultipartFile> fileList = new ArrayList<>();//创建一个通用的多部分解析器 CommonsMultipartResolver multipartResolver = new CommonsMultipartResolver(request.getSession().getServletContext());//判断 request 是否有文件上传,即多部分请求          if(multipartResolver.isMultipart(request)){        //转换成多部分request                MultipartHttpServletRequest multiRequest = (MultipartHttpServletRequest)request;              //取得request中的所有文件名              fileList = multiRequest.getFiles("file");            if (fileList == null || fileList.size() <= 0) {throw new Exception("上传文件失败");}            System.out.println("");        }return null;}
5、xml配置文件配置

    <bean id="multipartResolver"          class="org.springframework.web.multipart.commons.CommonsMultipartResolver">          <!-- set the max upload size100MB -->          <property name="maxUploadSize">              <value>104857600</value>          </property>          <property name="maxInMemorySize">              <value>4096</value>          </property>      </bean> 
6、jar包,除了springmvc常规的jar,还需要commons-fileupload-1.2.2.jar


*注意:关于formdata

The append() method of the FormData interface appends a new value onto an existing key inside a FormData object, or adds the key if it does not already exist.

The difference between FormData.set and append() is that if the specified key already exists, FormData.set will overwrite all existing values with the new one, whereas append() will append the new value onto the end of the existing set of values.


原创粉丝点击