最近在做blob流导出相关功能,其中需要导出excel、csv、word、zip压缩文件之类的,在导出excel和word中需要知道对应的content-type属性,关于blob格式如下:
后缀 | MIME Type |
---|---|
.doc | application/msword |
.docx | application/vnd.openxmlformats-officedocument.wordprocessingml.document |
.xls | application/vnd.ms-excel |
.xlsx | application/vnd.openxmlformats-officedocument.spreadsheetml.sheet |
.ppt | application/vnd.ms-powerpoint |
.pptx | application/vnd.openxmlformats-officedocument.presentationml.presentation |
- 具体代码如下:
this.ExportTransportEnd(sendData).then(res => {
const blob = new Blob([res],{type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'});
const objecturl = window.URL.createObjectURL(blob);
const creEleA = document.createElement("a");
creEleA.setAttribute("href",objecturl);
creEleA.setAttribute("download","结算凭证表");
creEleA.click();
})
【注】: 请求接口之前需要加参数
{responseType: 'blob'}
,具体代码如下:
ExportTransportEnd({ state, dispatch }, sendData) {
return new Promise((resolve, reject) => {
request.post(`${API_ROOT}/distribution/tms/carrier/exportTransportEnd`, sendData, {responseType: 'blob'})
.then(async res => {
resolve(res);
})
.catch(err => {
reject(err);
})
});
},
- get 方式传参代码如下:
axios
.get(api.serverUrl + "/order/exportOrder", {
params: params,
responseType: "blob" // 1.首先设置responseType对象格式为 blob:
})
.then(
res => {
//resolve(res)
let blob = new Blob([res.data], {
type: "application/vnd.ms-excel"
}); // 2.获取请求返回的response对象中的blob 设置文件类型,这里以excel为例
let url = window.URL.createObjectURL(blob); // 3.创建一个临时的url指向blob对象
// 4.创建url之后可以模拟对此文件对象的一系列操作,例如:预览、下载
let a = document.createElement("a");
a.href = url;
a.download = "导出表格.xlsx";
a.click();
// 5.释放这个临时的对象url
window.URL.revokeObjectURL(url);
},
err => {
resolve(err.response);
}
)
.catch(error => {
reject(error);
});
【注】:axios 请求可添加额外配置参数