zoukankan      html  css  js  c++  java
  • post方式实现导出/下载文件

    常用get的下载方式

    let url =  xxxx.action?a=xx&b=yy;
     window.location.href = url;
     // 或者
     window.open(url, '_self')

    弊端:当请求参数较多时,get的方式无法使用,这时候需要考虑post的方式,但是直接通过ajax的post的方式无法调用浏览器的下载功能

    post的下载方式

    原理: 创建一个隐藏form表单,通过form表单的提交刷新功能,实现下载。代码如下:

    // vue项目代码
      // 导出excel
        postExcelFile(params, url) {
          //params是post请求需要的参数,url是请求url地址
          var form = document.createElement("form");
          form.style.display = "none";
          form.action = url;
          form.method = "post";
          document.body.appendChild(form);
        // 动态创建input并给value赋值
          for (var key in params) {
            var input = document.createElement("input");
            input.type = "hidden";
            input.name = key;
            input.value = params[key];
            form.appendChild(input);
          }
    
          form.submit();
          form.remove();
        }
    
        //调用
         this.postExcelFile(
            { currentPage: 2, pageSize: 20 },
            'url/xxxxxxx/'
          );

    注意点:传给后端的参数不是json对象的形式,而是 currentPage=2&pageSize=20, 因此需要后端兄弟的配合

  • 相关阅读:
    nginx服务
    安装python
    软件包安装总结
    看内存大小
    计算机系统基础知识04
    计算机系统基础知识03
    计算机系统基础知识02
    计算机系统基础知识01
    python常用模块-logging模块
    python基础-包的使用
  • 原文地址:https://www.cnblogs.com/baixiaoxiao/p/15203272.html
Copyright © 2011-2022 走看看