js 异步返回文件流数据，下载文件

文件流下载方法

data: 流数据 type:
fileName：文件名
type: 文件类型，参考Blob方法，选择相应文件类型 https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Basics_of_HTTP/MIME_types/Common_types

Blob文件流下载的方法封装

// 文件流转blob对象下载
const downloadFile = (res, fileName) => {
	// Blob
	let data = null;
	if (res.contructor === Blob) {
		data = res;
	} else {
		data = res.data;
	}

	// 文件类型
	let type = data.type;

	// 如果有自定义的文件名则采用自定义的文件名，没有则采用后台返回的文件名
	// 从content-disposition中读取后台返回的文件名
	if ( !fileName && res.headers && res.headers['content-disposition'] ) {
		let disposition = res.headers['content-disposition'];
		if(disposition && disposition.constructor === String ){
			let dispositionList = disposition.split(';');
			dispositionList.forEach((item) => {
				let keyAndVal = item.split('=');
				if (keyAndVal[0] === 'filename' && keyAndVal[1]) {
					fileName = keyAndVal[1];
				}
			});
		}
	}
       // 如果后台没有定义的文件名，前端也没有传入的，则随机命名一个文件名
	fileName = fileName || Math.random().toString(16).slice(2) ;

	// 文件流
	let blob = new Blob([data], { type: type });
	// 获取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);
};

示例：

axios.post(url, param, {
  responseType: 'blob'
}).then((res) => {
  
}).catch((err) => {
  console.log(err.message);
});

JS使用BLOB方式下载Excel导致，文件损坏的问题解决

在请求方法中加入 responseType: ‘blob’ 后，问题解决

export const exportExcel = async (SysExportSetReq: any) => {
  return request.request({
    url: '/sam/master/baSysExportSet/exportExcel',
    method: 'POST',
    data: SysExportSetReq,
    responseType: 'blob'
  });
};

后台返回content-disposition字段，但无法js读取到的问题

参考地址：https://www.pudn.com/news/62b87fe1405aad31f707fddb.html