需求

• 管理后台需要随时下载数据报表，数据要实时生成后转换为excel下载。
• 文件不大，页面放置“导出”按钮，点击按钮后弹出保存文件对话框保存（不是没有其他解决办法，只是体验不是太好，这里不提，重点是这个思路方法）

解决方案

方法一

请求文件的接口能改为GET则可以使用这种方法

<a  class="btn btn-primary btn-xs" download="data.xlsx" href="download/?filename=aaa.txt"><i class="fa fa-share-square-o fa-lg"></i> 导出</a> 

或者变换一种方式，使用js动态创建a标签

<button type="button"  onclick="download()">导出</button> 

function download() {     var a = document.createElement('a');     var url = 'download/?filename=aaa.txt';     var filename = 'data.xlsx';      a.href=url;     a.download = filename;     a.click()  } 

缺点

不是

方法二

错误方式

常规方法，使用jquery：

<button type="button"  onclick="download()">导出</button> 

function download() {     var url = 'download/?filename=aaa.txt';     $.get(url, function (data) {         console.log(typeof(data))         blob = new Blob([data])         var a = document.createElement('a');         a.download = 'data.xlsx';         a.href=window.URL.createObjectURL(blob)         a.click()     }) } 

这种方式保存的文件是不能打开的，console.log(typeof(data))会看到是string类型，原因是jquery将返回的数据转换为了string，不支持blob类型。

正确方式

<button type="button"  onclick="download()">导出</button> 

function download() {     var url = 'download/?filename=aaa.txt';     var xhr = new XMLHttpRequest();     xhr.open('GET', url, true);        // 也可以使用POST方式，根据接口     xhr.responseType = "blob";    // 返回类型blob     // 定义请求完成的处理函数，请求前也可以增加加载框/禁用下载按钮逻辑     xhr.onload = function () {         // 请求完成         if (this.status === 200) {             // 返回200             var blob = this.response;             var reader = new FileReader();             reader.readAsDataURL(blob);    // 转换为base64，可以直接放入a表情href             reader.onload = function (e) {                 // 转换完成，创建一个a标签用于下载                 var a = document.createElement('a');                 a.download = 'data.xlsx';                 a.href = e.target.result;                 $("body").append(a);    // 修复firefox中无法触发click                 a.click();                 $(a).remove();             }         }     };     // 发送ajax请求     xhr.send() } 

参考资料

受该文章启发 http://www.cnblogs.com/cdemo/p/5225848.html