在JS中发送ajax请求，并且解析后台返回的Blob类型数据，将数据转换为文件

在JS中如何发送ajax请求，并且解析后台返回的Blob类型数据，将数据转换为文件导出，附带兼容IE8等浏览器

普通的jQuery中的ajax请求后台，并不能处理Blob类型的数据，这里用的原生的XMLHttpRequest请求后台

这里是做报表导出功能的一种实现：

//点击-报表导出-执行事件

function reportExport(){

// 获取页面当前选中记录行

var rows = $('#datagridTable').datagrid('getSelections');



// 判断是否有选中记录

if (rows.length == 0) {

    $.walk.alert("请先选中需要导出的数据！", "info");

    return;

}


$.walk.confirm("确定要导出选中的数据吗？", function(data) {

if (!data) {

    return false;

}



//组装数据-这个参数用来在后台查询SQL获取导出数据用

var tradeIds = "";

for (var i = 0; i < rows.length; i++) {

    tradeIds += rows[i].TRADE_ID + ",";

}



var originName = "物流配送日交接单";//导出文件的名称设置

var url = baseUrl + "/logisticsStatus/saveDeliverRecords";//设置后台请求映射

var xhr = new XMLHttpRequest();

xhr.open('POST', url, true); // 设置请求方式POST方式

xhr.responseType = "blob"; // 返回类型blob

xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");//设置请求内容类型

// 请求回调函数，在请求后台完成，后台返回数据后执行此方法onload

xhr.onload = function() {


if (this.status != 200) {// 判断请求状态码，看请求是否成功执行

    $.walk.alert("导出失败！", "info");

    return;

}

var content = this.response; //获取后台响应内容
//解析后台返回的文件内容，这里主要是处理Blob类型
var excelBlob = new Blob([ content ], {type : 'application/vnd.ms-excel'});

var fileName = originName + ".xlsx";//

//浏览器兼容处理
if (isIE()) {

    window.navigator.msSaveOrOpenBlob(excelBlob, fileName);

} else {

    var a = document.getElementById("exportbtn");

    a.href = URL.createObjectURL(excelBlob);

    a.download = fileName;

    a.click();

    a.href = "";

}


    //数据导出成功后，刷新前台列表 datagrid
    $('#datagridTable').datagrid("reload");

};

    // 发送ajax请求
    xhr.send("tradeIds=" + tradeIds + "&originName=" + originName);

});

}



//判断是否IE浏览器

function isIE() {

    if (!!window.ActiveXObject || "ActiveXObject" in window) {

    return true;

    } else {

    return false;

    }

}