zoukankan      html  css  js  c++  java
  • 文件导出也可以这么写【js+blob】

    文件导出在软件开发中是个比较常用的功能,基本原理也很简单:

    • 浏览器向后台发送一个Get请求
    • 后台处理程序接收到请求后,经过处理,返回二进制文件流
    • 浏览器接收到二进制文件流后提示下载文件

    调用的js方法如下 , 通过URL传值的方式Get请求到后台处理程序

    function expExcel(){
        
        var url="../function/expExcel?ExportUnit=谨华控股";
            
        window.location.href=url;
    }

    这种方式虽然简单实用,但在有些情况下也不适用。比如只能采用GET方法,传递参数不能太复杂。一般需要在调用的页面创建一个隐藏iframe。。。。。

    下面一个angularjs 的一个导出实例

    self.excel = function() {
        var dataUrl = "http://www.order.com/list/excel";
        $http({
            method: 'post',
            url: dataUrl,
            data: {},
            transformRequest: function(data) {
                return $.param(data);
            },
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded'
            },
            responseType: 'arraybuffer'
        }).success(function(data) {
    
            var blob = new Blob([data], {
                type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
            });
    
            var da = new Date();
            var fileName = "数据导出" + da.getFullYear() + '-' + (da.getMonth() + 1) + "-" + da.getDate() + ".xlsx";
    
            self.saveas(blob, fileName);
    
        });
    
    };
    
    self.saveas = function(blob, fileName) {
        if (window.navigator.msSaveOrOpenBlob) { // For IE:
            navigator.msSaveBlob(blob, fileName);
        } else { // For other browsers:
            var link = document.createElement('a');
            link.href = window.URL.createObjectURL(blob);
            link.download = fileName;
            link.click();
            window.URL.revokeObjectURL(link.href);
        }
    }

    一直以来,JS都没有比较好的可以直接处理二进制的方法。而Blob的存在,允许我们可以通过JS直接操作二进制数据。

    Blob对象可以看做是存放二进制数据的容器,此外还可以通过Blob设置二进制数据的MIME类型。

    var blob = new Blob([data], {
                type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
            });
  • 相关阅读:
    [译]C++如何切分字符串
    Reverse Words in a String
    excel 获取中文拼音首字母
    jquery 获取css position的值
    excel 截取单元格部分内容(从指定位置截取)
    excel 根据单元格内容自动调整列宽
    excel 如何为列添加指定内容(字符串)
    android_handler(二)
    "Simple Factory" vs "Factory Method" vs "Abstract Factory" vs "Reflect"
    HDU 5074 Hatsune Miku 2014 Asia AnShan Regional Contest dp(水
  • 原文地址:https://www.cnblogs.com/lilunjia/p/8580054.html
Copyright © 2011-2022 走看看