Blob, Uint8Aray, atob/btoa in lt IE9 browser

标签(空格分隔): compatibility


之前写的代码全部在Chrome调试,用IE打开发现各种问题。

1. <a download=""></a>

首先IE不支持HTML5的download属性:

var a = document.createElement('a');
var ev = document.createEvent('HTMLEvents');
var name = '报告导出列表' + new Date().toLocaleString() + '.xlsx';
ev.initEvent('click', true, true);
a.download = name;
a.href = URL.createObjectURL(blob);
a.click();

在IE下是不支持的,可以使用msSaveBlob来解决(IE10+):

if (navigator.msSaveBlob) {
return navigator.msSaveBlob(blob, name);
} a.click();

2. atob/btoa

base64的encode(btoa)和decode(atob)。IE10+可以支持。低于IE10的可以使用polyfill实现:base64.js

var byteCharacters;
if (window.atob) {
byteCharacters = atob(b64Data);
} else {
byteCharacters = Base64.decode(b64Data);
}

3. Blob

Blob也仅支持IE10+,网上有很多polyfill来实现,这里仅作推荐Blob.js

4. Uint8Aray

一个库有很多这方面的支持:其中的typedarray.js,如下部分源码:

...
global.Int8Array = global.Int8Array || Int8Array;
global.Uint8Array = global.Uint8Array || Uint8Array;
global.Uint8ClampedArray = global.Uint8ClampedArray || Uint8ClampedArray;
global.Int16Array = global.Int16Array || Int16Array;
global.Uint16Array = global.Uint16Array || Uint16Array;
global.Int32Array = global.Int32Array || Int32Array;
global.Uint32Array = global.Uint32Array || Uint32Array;
global.Float32Array = global.Float32Array || Float32Array;
global.Float64Array = global.Float64Array || Float64Array;
...

5. 文件下载

推荐一个文件下载库:FileSaver。使用也很简单,比如以下直接引用的方式使用:

<script src="../js/FileSaver.min.js"></script>
<script>
...
saveAs(blob, 'hello world.xlsx');
</script>

这个库也仅支持IE10+。

Blob, Uint8Aray, atob/btoa in lt IE9 browser的更多相关文章

  1. Javascript 中 atob/btoa

    解决 Javascript 中 atob 方法解码中文字符乱码问题 由于一些网络通讯协议的限制,你必须使用 window.btoa() 方法对原数据进行编码后,才能进行发送.接收方使用相当于 wind ...

  2. WebBrowser与IE的关系,如何设置WebBrowser工作在IE9模式下?

    原文 WebBrowser与IE的关系,如何设置WebBrowser工作在IE9模式下? 一.问题的提出 偶然发现,Winform里的WebBrowser和IE实际安装的版本似乎并不同步,很有趣! 下 ...

  3. JS 在页面上直接将json数据导出到excel,支持chrome,edge,IE10+,IE9,IE8,Safari,Firefox

    JS 在页面上直接将json数据导出到excel,支持chrome,edge,IE10+,IE9,IE8,Safari,Firefox <html> <head> </h ...

  4. Vue导出json数据到Excel表格

    一.安装依赖 npm install file-saver --save npm install xlsx --save npm install script-loader --save-dev 二. ...

  5. 【vue】vue中实现导出excel

    1.安装依赖 cnpm install -S file-saver xlsx cnpm install -D script-loader 2.例如在src文件夹中新建一个名为vendor(vendor ...

  6. [JavaScript]为JS处理二进制数据提供可能性的WEB API

    写这篇博客的起源是在div.io上的一篇文章<你所不知道的JavaScript数组>by 小胡子哥下的评论中的讨论. 因为随着XHR2和现代浏览器的普及,在浏览器当中处理二进制不再向过去那 ...

  7. vue中使用导出表格功能

    1.下载依赖 npm install -S file-saver xlsx npm install -D script-loader 2.在src下创建vendor文件夹,并在文件夹中放两个文件 Bl ...

  8. vue导出excel数据表格功能

    前端工作量最多的就是需求,需求就是一直在变,比如当前端数据写完之后,需要用Excel把数据下载出来. 第一步安装依赖包,需要把代码下载你的项目当中 cnpm install  file-saver c ...

  9. BASE64转文件下载

    你可以用HTML 5 注意:返回的文件数据必须是base 64编码的,因为您不能对二进制数据进行JSON编码 在我的AJAX我得到了如下的数据结构: <!DOCTYPE html> < ...

随机推荐

  1. loj 2038 / 洛谷 P4345 [SHOI2015] 超能粒子炮・改 题解

    好玩的推式子 题目描述 曾经发明了脑洞治疗仪与超能粒子炮的发明家 SHTSC 又公开了他的新发明:超能粒子炮・改--一种可以发射威力更加强大的粒子流的神秘装置. 超能粒子炮・改相比超能粒子炮,在威力上 ...

  2. 离散化test

    #include<bits/stdc++.h> using namespace std; const int maxn = 1e6+11; int ll[maxn],rr[maxn],ma ...

  3. poj1318 Word Amalgamation 字符串排序(qsort)

    Word Amalgamation Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 9794   Accepted: 4701 ...

  4. knime 设置 小数点精度

    kinme 默认小数精度是保留三位小数. 如果0.0003,knime会自动舍弃,读出0.下面步骤教你怎么把小数精度全部显示. File->references->preferred re ...

  5. GreenPlum 大数据平台--备份-邮件配置-gpcrondump & gpdbrestore(五)

    01,备份 生成备份数据库 [gpadmin@greenplum01 ~]$ gpcrondump -l /gpbackup/back2/gpcorndump.log -x postgres -v [ ...

  6. How to fix the issue that GEM_HOME and/or GEM_PATH not set issue for rvm in mac version 10.12

    add following lines below "export PATH="$PATH:$HOME/.rvm/bin" # Add RVM to PATH for s ...

  7. ionic 开发当中,有一些常用的方法。

    在开发项目的时候,有些常用的功能封装到一个类里. 以后要用的话,直接导入过来就可以用了,有一些方法是从网站复制过来的,有些方法是网上复制过来,然后自己修改了一下,标记一下吧!   /**      * ...

  8. TOJ 2815 Connect them (kruskal+并查集)

    描述 You have n computers numbered from 1 to n and you want to connect them to make a small local area ...

  9. 6个Unity 开源项目分享!

    http://gad.qq.com/article/detail/38279?sessionUserType=BFT.PARAMS.249034.TASKID&ADUIN=991655778& ...

  10. unity摄像机脚本

    直接挂载在摄像机上面即可 1.摄像机自由平移 using UnityEngine; using System.Collections; /// <summary> /// 摄像机视角自由移 ...