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. POJ_3262 Protecting the Flowers 【贪心】

    一.题面 POJ3262 二.分析 这题要往贪心上面想应该还是很容易的,但问题是要证明为什么比值关系就能满足. 可以选择几个去分析,入1-6  与 2-15  和 1-6 与2-5 和 1-6 与 2 ...

  2. bzoj3196 二逼平衡树 树状数组套线段树

    题目传送门 思路:树状数组套线段树模板题. 什么是树状数组套线段树,普通的树状数组每个点都是一个权值,而这里的树状数组每个点都是一颗权值线段树,我们用前缀差分的方法求得每个区间的各种信息, 其实关键就 ...

  3. git平台创建项目(码云)

    一.在码云创建项目 1.新建仓库 2,项目名称等 3.创建后的界面 4.克隆远程项目到本地(项目地址和用户名密码) git clone 仓库地址 注意,如果当前目录下出现git仓库同名目录时,会克隆失 ...

  4. python - 约瑟夫问题

    在罗马人占领乔塔帕特后,39 个犹太人与约瑟夫及他的朋友躲到一个洞中.39个犹太人决定宁愿死也不要被敌人俘虏,商定一种特殊的方式自杀,41个人排成一个圆圈,由第1个人开始报数,每报到第3人该人就必须自 ...

  5. Android报错

      Error:Execution failed for task ':app:processDebugResources'. > com.android.ide.common.process. ...

  6. shell 对字符的求长

    一,测试环境 echo "To the world you may be one person but to one person you may be the world" 对于 ...

  7. 案例48-crm练习利用spring管理service和dao层的对象

    1 导包 2 将 Service 对象以及 Dao 对象配置到 spring 容器 <?xml version="1.0" encoding="UTF-8" ...

  8. Unity3D游戏轻量级xlua热修复框架

    Unity3D游戏轻量级xlua热修复框架   一 这是什么东西 前阵子刚刚集成xlua到项目,目的只有一个:对线上游戏C#逻辑有Bug的地方执行修复,通过考察xlua和tolua,最终选择了xlua ...

  9. Unity3d Attribute 总结

    举两个例子,在变量上使用[SerializeFiled]属性,可以强制让变量进行序列化,可以在Unity的Editor上进行赋值. 在Class上使用[RequireComponent]属性,就会在C ...

  10. RabbitMQ学习整理

    1.什么是消息队列? 概念: 消息队列(Message Queue,简称MQ),本质是个队列,FIFO先入先出,只不过队列中存放的内容是一些Message. 2.为什么要用消息队列,应用场景? 不同系 ...