Ajax를 사용하여 파일 일괄 업로드 및 다운로드를 구현하는 방법

이번에는 Ajax로 파일 일괄 업로드 및 다운로드를 구현하는 방법을 보여드리겠습니다. Ajax로 파일 일괄 업로드 및 다운로드를 구현할 때 주의 사항은 무엇입니까?

오늘은 파일을 업로드하고 다운로드했습니다. 간단히 요약하면 기본적인 웹 프로젝트 구축과 SpringMVC 프레임워크 구성에 대해서는 여기서 자세히 작성하지 않겠습니다.

업로드 형식:

          

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 구성 플러스:

<!-- 配置文件上传 -->
  <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><p style="text-align: left;">다운로드한 JSP 페이지 코드는 다양한 요구 사항에 따라 직접 설계했습니다. </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><p style="text-align: left;"> 여러 파일을 하나의 압축 패키지로 다운로드한 후 생성된 임시 압축 파일을 삭제하세요. </p><p style="text-align: left;">Ajax를 사용하여 다운로드 페이지에서 요청을 제출하는 경우 참고하세요: ajax 함수의 반환 유형은 xml, text, json, html 및 기타 유형만 있고 "스트림" 유형은 없습니다. ajax 다운로드를 구현하고 싶지만 해당 ajax 기능을 사용할 수 없습니다. <a href="http://www.php.cn/code/12666.html" target="_blank">파일 다운로드</a>. 하지만 js를 사용하여 양식을 생성하고, 이 양식을 사용하여 매개변수를 제출하고, "스트림" 유형 데이터를 반환할 수 있습니다. </p><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();//表单提交                      }

이 기사의 사례를 읽으신 후 방법을 마스터하셨다고 생각합니다. 더 흥미로운 정보를 보려면 PHP 중국어 웹사이트의 다른 관련 기사에 주목하세요!

추천 자료:

새로 고침이 없는 드롭다운 링크를 구현하는 Ajax+Servlet(코드 포함)

Ajax를 사용하여 사용자 이름이 중복되는지 비동기적으로 확인하는 방법

위 내용은 Ajax를 사용하여 파일 일괄 업로드 및 다운로드를 구현하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!