post请求下载文件流,重点是ajax如何设置接收类型
xhrFields: {
responseType: ‘blob’ // 重要:将响应类型设置为 ‘blob’
},
具体配置如下,不要加其他多余的配置,成功后创建a标签下载
//请求参数
const p = {}
$.ajax({
url: 'xxx',
method: 'POST',
data:JSON.stringify(p),
timeout: 90000,
xhrFields: {
responseType: 'blob' // 重要:将响应类型设置为 'blob'
},
contentType: 'application/json; charset=utf-8',
success: function(data,status,xhr) {
// 将英文冒号转变为中文冒号
const filename = '批量导出'
var a = document.createElement('a');
var url = window.URL.createObjectURL(data);
a.href = url;
a.download = filename;
document.body.append(a);
a.click();
window.URL.revokeObjectURL(url);
a.remove();
},
error: function(xhr, status, error) {
console.error('下载文件时出错:', error);
},
complete: ()=>{
// 无论成功或者失败都会执行,可以在这取消加载状态
}
});
如果返回数据不是blob类型,可以先转换成blob再使用a标签下载
downLoadFile (content) {
//content 为后端返回的数据
//如果后端返回文件名的话
const fileName = decodeURI(res.headers['content-disposition'].split('=')[1])
const data = new Blob([content])
// for IE
if (window.navigator.msSaveOrOpenBlob) {
window.navigator.msSaveOrOpenBlob(csvData, fileName)
} else { // for Non-IE
var a = document.createElement('a');
var url = window.URL.createObjectURL(data);
a.href = url;
a.download = filename;
document.body.append(a);
a.click();
window.URL.revokeObjectURL(url);
a.remove();
}
}