js实现文件流下载文件

以下2个函数实现:函数一位原生ajax将请求的响应数据类型设置为blob,函数二是创建blob对象实现文件下载

// http请求函数,支持配置请求和响应参数
function ajaxRequest(method, url, type) {
return new Promise((resolve, reject) => {
const req = new XMLHttpRequest();
req.open(method, url, true);
req.responseType = type;
req.onreadystatechange = () => {
// readyState == 4说明请求已完成
if (req.readyState === 4) {
const data = req.response;
// 获取文件名
const content = req.getResponseHeader('Content-Disposition');
const fileName = content && content.split(';')[1].split('filename=')[1];
if (req.status === 200 || req.status === 304) {
resolve({data, fileName});
}
else {
reject(data);
}
}
};
// 发送数据
req.send();
});
}

 

// 文件流转blob对象下载
function downloadFile(data, type, fileName) {
let blob = new Blob([data], {type: `application/${type};charset=utf-8`});
// 获取heads中的filename文件名
let downloadElement = document.createElement('a');
// 创建下载的链接
let href = window.URL.createObjectURL(blob);
downloadElement.href = href;
// 下载后文件名
downloadElement.download = fileName;
document.body.appendChild(downloadElement);
// 点击下载
downloadElement.click();
// 下载完成移除元素
document.body.removeChild(downloadElement);
// 释放掉blob对象
window.URL.revokeObjectURL(href);
}

 

posted @ 2022-03-09 15:32  刘兵博客  阅读(2946)  评论(0编辑  收藏  举报