浏览器自定义文件下载

HTTP协议中有一个content-type属性，此属性用于定义浏览器如何处理将要加载的数据，此属性的值可以查看 MIME 类型。
常见的MIME 类型如下，

text/html（HTML 文档）；
text/plain（纯文本）；
text/css（CSS 样式表）；
image/gif（GIF 图像）；
image/jpeg（JPG 图像）；
application/x-javascript（JavaScript 脚本）；
application/x-shockwave-flash（Flash）；
application/x- www-form-urlencoded（使用 HTTP 的 POST 方法提交的表单）；
multipart/form-data（同上，但主要用于表单提交时伴随文件上传的场合）。
application/octet-stream（二进制流）

浏览器对于application/octet-stream的处理，通常都是下载到本地。
对于image/jpeg的处理，通常是解析渲染显示。

需求是用户点击image/jpeg的文件进行下载。
方法1：
响应头设置成Content-Type:application/octet-stream

方法2：
响应头新增属性Content-Disposition:attachment;filename=FileName.jpg
如果是跨域资源，需新增属性Access-Control-Allow-Origin:*

方法3：
使用a标签的download属性。
如果是跨域资源，download属性失效。

方法4：
使用浏览器的构建能力，对二进制数据进行特殊编码（浏览器能方便识别），再对编码结果进行对应处理。

使用(new FileReader()).readAsDataURL把二进制数据进行base64编码，再转换成Data URL。
base64编码需要注意的是，在浏览器的地址栏中需要进行url编码。

使用window.URL.createObjectURL把二进制对象或者文本转化成blob对象（浏览器支持的MIME类型），再转换成Blob URL。

可以方便的使用XMLHttpRequest获取blob数据，并对它进行相应格式的处理。

var downloadJS = require('download.js');
var x=new XMLHttpRequest();
x.open("GET", '下载文件的地址', true);
x.responseType = 'blob';
x.onload=function(e){downloadJS(x.response, '下载文件的名称', 'application/rar' ); }
x.send()

这里的download.js是指第三方blob处理库http://danml.com/download.html

我们若知道了一些文件的编码原理，便可以前端生成这些文件提供下载。
比如csv文件的编码规则是：

• 单元格之间是通过,隔开的
• 换行是通过\n实现的

我们便可以把json数据按照csv编码规则进行转化，然后再转化成blob对象，生成文件给用户下载。
csv导出库 https://github.com/Cody2333/csv-exportor
excel导出库 https://github.com/SheetJS/js-xlsx

参考：
http://w3help.org/zh-cn/causes/CH9001#standard_reference
https://segmentfault.com/a/1190000011563430
https://segmentfault.com/a/1190000011389463
https://github.com/eligrey/FileSaver.js/