• axios用get或post请求下载文件,可下载原来的文件名


    一、get请求下载:

    window.open(url, params)

    二、post请求下载

    创建一个a标签下载
    axios({ url: url, method:
    'post', data: data, responseType: 'blob' }).then(res => { let blob = new Blob([res.data]) let url = window.URL.createObjectURL(blob) let link = document.createElement('a') link.style.display = 'none' link.href = url // 文件名一般是在res.headers里:content-disposition;fileName=xxxxxxxxxx.csv,这个让后端统一规定文件名怎么放前端就怎么取就行 let str = typeof res.headers['content-disposition'] === 'undefined' ? res.headers['Content-Disposition'].split(';')[1] : res.headers['content-disposition'].split(';')[1] let filename = typeof str.split('fileName=')[1] === 'undefined' ? str.split('filename=')[1] : str.split('fileName=')[1] link.setAttribute('download', decodeURIComponent(filename)) // 解码,这里也可以自定义下载的文件名字,如link.setAttribute('download', 'xxxxxdownload.xls') document.body.appendChild(link) link.click() //用新窗口打开window.open(link.click()),但是下载完成后不会先get请求那样自动关闭窗口 }) .catch(error => { console.log(error) })

    用哪种方式下载:

    1)下载文件比较大建议使用get。如果用post,点了会半天没反应,得加loading之类的而且体验也不好,用get在用window.open打开新窗口下载,下载完后会自动关闭窗口体验比较好

    2)下载文件不大而且传参很多的话建议使用post。不过只能在本页面下载,不能打开新窗口下载,哪怕把数据放到window.open打开新窗口下载,但下载完成后不会自动关闭新窗口

    3)下载文件很大而且传参也很大建议用get,传参过长超过浏览器限制,那让后台再加一个post接口,把这些多的参数用这个post传过去,再回传一下类似秘钥之类的用于get下载

  • 相关阅读:
    FPGA中亚稳态相关问题及跨时钟域处理
    异步FIFO---Verilog实现
    关于 FPGA 内部信号扇入扇出
    使用Xilinx IP核进行PCIE开发学习笔记
    aurora 64B/66B ip核设置与例程代码详解
    Verilog设计Valid-Ready握手协议
    【待写Java线程之线程终止 Interrupt 】
    【数据结构*转】斐波那契数列
    【数据结构】二分查找
    【待完善】资料记录
  • 原文地址:https://www.cnblogs.com/zzwlong/p/15540482.html
Copyright © 2020-2023  润新知