How to implement batch upload and download of files with Ajax

This time I will show you how to implement batch upload and download of files with Ajax. What are the precautions for implementing batch upload and download of files with Ajax? The following is a practical case, let's take a look.

I uploaded and downloaded files today. To summarize briefly, the basic web project establishment and SpringMVC framework construction will not be written in detail here.

Upload form:

          

Upload Ajax:

<script>
/*
 * 上传文件
 */
function upload(){
  var formData = new FormData($( "#uploadfiles" )[0]);
   $.ajax({
      type: "post",
      url: "./path/upload",
      dataType: "json",
      data: formData,
      /**  
       *必须false才会自动加上正确的Content-Type  
       */ 
      contentType : false, 
      /**  
       * 必须false才会避开jQuery对 formdata 的默认处理  
       * XMLHttpRequest会对 formdata 进行正确的处理  
       */ 
      processData : false,
      success: function(data){//从后端返回数据进行处理
       if(data){
         alert("上传成功！");
       }else{
         alert("上传失败！");
       }
      },
      error: function(err) {//提交出错
        $("#msg").html(JSON.stringify(err));//打出响应信息
        alert("服务器无响应");
       }
     });
}
</script>

spring.xml configuration plus:

<!-- 配置文件上传 -->
  <bean>
    <!-- 默认编码 -->
    <property></property>
    <!-- 文件大小最大值 -->
    <property></property>
    <!-- 内存中的最大值 -->
    <property></property>
  </bean>
controller：
/*
   * 上传多个文件
   */
  @RequestMapping(value = "/upload", produces = "application/json;charset=UTF-8")
  public @ResponseBody
  boolean uploadFiles(@RequestParam("file_upload") MultipartFile [] files) {
    boolean result = false;
    String realPath;
    for(int i=0;i<files.length>The downloaded jsp page code is designed by yourself according to different needs. Here is the controller code: <p style="text-align: left;"></p>
<pre class="brush:php;toolbar:false">/*
   * 下载多个文件
   */
  @RequestMapping(value = "/download")
  public void downloadFiles(HttpServletResponse response) {
    String str= request.getParameter("rows");//下载文件信息，包括文件名、存储路径等
    JSONArray path=(JSONArray) JSONArray.parse(request.getParameter("rows"));
    Path paths[]=new Path[path.size()];
    paths = JSONArray.parseArray(str, Path.class).toArray(paths);
    String uri = "d:"+ File.separator + "mldn.zip";//临时文件存储路径
    File zipFile = new File(uri) ;  // 定义压缩文件名称 
    ZipOutputStream zipOut = null;// 声明压缩流对象 
    InputStream input = null;
    //将要压缩的文件加入到压缩输出流中
    try {
      zipOut = new ZipOutputStream(new FileOutputStream(zipFile));
    } catch (FileNotFoundException e) {
      e.printStackTrace();
    }
    for(int i = 0;i<paths.length>Download multiple files into a compressed package, and then download the generated temporary compressed file delete. <p style="text-align: left;"></p>If you use Ajax to submit a request on the download page, please note: the return types of the ajax function are only xml, text, json, html and other types, and there is no "stream" type, so we need to implement ajax download and cannot use the corresponding The ajax function performs <p style="text-align: left;"> file download<a href="http://www.php.cn/code/12666.html" target="_blank">. But you can use js to generate a form, use this form to submit parameters, and return "stream" type data. </a></p>Example: <p style="text-align: left;"></p><pre class="brush:php;toolbar:false">function download(){
    var form=$("

");//定义一个form表单     form.attr("style","display:none");     form.attr("target","");     form.attr("method","post");     form.attr("action","./path/download");//请求url     var input1=$("");     input1.attr("type","hidden");     input1.attr("name","rows");//设置属性的名字     input1.attr("value",“test”);//设置属性的值     $("body").append(form);//将表单放置在web中     form.append(input1);     form.submit();//表单提交                      }

I believe you have mastered the method after reading the case in this article. For more exciting information, please pay attention to other related articles on the php Chinese website!

Recommended reading:

Ajax+Servlet to implement non-refresh drop-down linkage (with code)

How to use Ajax asynchronously Check if the username is duplicate

The above is the detailed content of How to implement batch upload and download of files with Ajax. For more information, please follow other related articles on the PHP Chinese website!