下载文件，一般后台返回的是文件流。前台如果用的fetch的话，respose里面是空的，什么也看不到。用的axios的话，是一堆字符串形式的东西。
封装请求方法的时候，用 response.headers.get('Content-Type').includes('application/json') 来判断返回结果是不是文件流, 为true的话就不是文件流.
文件的名称要从header里面去取（跨域的时候是取不到的，需要挂nginx）
// 这个是封装请求时获取文件名称的方法
.then((respose) => {
let filename = '';
const disposition = response.headers.get('Content-Disposition');
if (disposition && disposition.indexOf('attachment') !== -1) {
const filenameRegex = /filename[^;=
]*=((['"]).*?2|[^;
]*)/;
const matches = filenameRegex.exec(disposition);
if (matches != null && matches[1]) filename = decodeURIComponent(matches[1].replace(/['"]/g, ''));
}
const res = {
data: response.blob(),
filename,
};
return res;
})
// 这个是接口成功之后的操作,需要注意的是，如果接口失败，返回的一定是json字符串，这里要做判断
callback: ((res) => {
Promise.resolve(res.data)
.then((blob) => {
this.postDownload(blob, res.filename);
});
})
postDownload = (blob, filename) => {
if (typeof window.navigator.msSaveBlob !== 'undefined') {
// IE
window.navigator.msSaveBlob(blob, filename);
} else {
const URL = window.URL || window.webkitURL;
const downloadUrl = URL.createObjectURL(blob);
if (filename) {
// use HTML5 a[download] attribute to specify filename
const a = document.createElement('a');
// safari doesn't support this yet
if (typeof a.download === 'undefined') {
window.location = downloadUrl;
} else {
a.href = downloadUrl;
a.target = '_blank';
a.download = filename;
document.body.appendChild(a);
a.click();
}
} else {
window.location = downloadUrl;
}
setTimeout(() => { URL.revokeObjectURL(downloadUrl); }, 100); // cleanup
}
},