美文网首页
如何下载Excel(或其他等)大文件

如何下载Excel(或其他等)大文件

作者: RosalindJuan | 来源:发表于2019-01-07 10:40 被阅读0次

    下载Excel等大文件时,我们通过ajax请求到二进制的data数据,再利用Blob对象包装,即可实现下载大文件。

    Blob对象

    一个 Blob对象表示一个不可变的, 原始数据的类似文件对象。

        var blob = new Blob(data[, options]))
    

    返回一个新创建的 Blob 对象,其内容由参数中给定的数组串联组成。
    接受两个参数:

    • data:是一组数据,必须是数组,即使只有一个字符串也必须用数组装起来.
    • options:是对这一Blob对象的配置属性,目前也只有一个type也就是相关的MIME需要设置 type的值: ‘text/csv,charset=UTF-8’ 设置为csv格式,并设置编码为UTF-8,’text/html’ 设置成html格式。

    请求二进制数据

    • 请求数据类型: responseType: 'arraybuffer' // 二进制流
    • 请求返回的数据:res

    URL.createObjectURL()

    URL.createObjectURL() 静态方法会创建一个 DOMString,其中包含一个表示参数中给出的对象的URL。这个 URL 的生命周期和创建它的窗口中的 document 绑定。这个新的URL 对象表示指定的 File 对象或 Blob 对象。

    每次调用 createObjectURL() 方法时,都会创建一个新的 URL 对象,当不再需要这些 URL 对象时,每个对象必须通过调用 URL.revokeObjectURL() 方法传入创建的URL为参数,用来释放它。浏览器会在文档退出的时候自动释放它们,但是为了获得最佳性能和内存使用状况,应该在安全的时机主动释放掉它们。

    下载excel 表格 :

        res => {
            const blob = new Blob([res], {
              type: 'application/ynd.ms-excel;charset=UTF-8'    // excel表格类型
            }); // 创建Blob实例
            const downloadElement = document.createElement('a');
            const href = window.URL.createObjectURL(blob); // 创建 URL 对象
            downloadElement.href = href;
            downloadElement.download = 'xxx.xls';
            document.body.appendChild(downloadElement);
            downloadElement.click();
            document.body.removeChild(downloadElement); // 下载完成移除元素
            window.URL.revokeObjectURL(href); // 释放掉blob对象
          }
    

    相关文章

      网友评论

          本文标题:如何下载Excel(或其他等)大文件

          本文链接:https://www.haomeiwen.com/subject/vtvyrqtx.html