解决vue使用axios post 方法导出excel乱码问题

1.使用axios中的post传递参数,后台导出excel数据。api接口调用如下:

2.后台设置response的content-type为:content-type:application/octet-stream;charset:utf-8

3.下载文件。根据第一步的设置请求后的格式如下:

下载的方法如下:

let config = {
headers: {
"Content-Type": "multipart/form-data"
},
'responseType':'blob'
}
axios.post('api',params,config).then((res)=>{
let blob = new Blob([res.data], {type: "application/vnd.ms-excel"});
const fileName = `模板文件${Date.parse(new Date())}.xlsx`;
if ('download' in document.createElement('a')) { // 非IE下载
    const elink = document.createElement('a');
    elink.download = fileName;
    elink.style.display = 'none';
    elink.href = URL.createObjectURL(blob);
    document.body.appendChild(elink);
    elink.click();
    URL.revokeObjectURL(elink.href); // 释放URL 对象
    document.body.removeChild(elink);
} else { // IE10+下载
    navigator.msSaveBlob(blob, fileName);
}

 

下载的文件打开是乱码,后来发现必须给config添加responseType为blob的属性 ,添加'responseType':'blob'之后完美解决乱码问题。

 

你可能感兴趣的:(vue,项目踩坑)