vue导出文件问题

Question

如下图所示 ，
问题：导出了两份，其实打开内容是一样的

let res = await visitorsApi.export(newparams);
                console.log('export res=', res);
                let blob = new Blob([res.data], {type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=UTF-8'})
                let link = document.createElement('a')
                document.body.appendChild(link)
                link.href = window.URL.createObjectURL(blob)
                // 配置下载的文件名
                link.download = "访客出入"
                link.click();
                URL.revokeObjectURL(link.href); // 释放URL 对象
                document.body.removeChild(link); //释放标签

 // 导出
    export(params){
        return new Promise((resolve) => {
            axios
            .post(`${audit}/accessTask/exportExcel`, params, {responseType: 'arraybuffer'}).then(res=>{
                resolve(res)
            })
        });
    }

Answer 1

问题原因找到了，
为什么下载两次？
因为我是vue项目嵌入到iframe框架中，所以直接调用接口即可下载，可我又做了一次前端下载，所以下载了两次，但是单独的vue项目没这个问题，只有iframe有这个问题，大家注意一下吧！

文件名为什么乱码？
后台文件名格式设置有问题，改成UTF-8即可

解决办法：
注释前端下载，再把后台文件名格式设置成utf-8即可

let res = await visitorsApi.export(newparams);
// console.log('export res=', res);
// let blob = new Blob([res.data], {type: 'application/vnd.ms-excel'})
// let url = window.URL.createObjectURL(blob)
// let link = document.createElement('a');
// link.href = url;
// link.download = "访客出入"
// document.body.appendChild(link)
// // 配置下载的文件名
// link.style.display = 'none';
// link.dispatchEvent(new MouseEvent('click', {bubbles: true, cancelable: true, view: window}))
// URL.revokeObjectURL(link.href); // 释放URL 对象
// document.body.removeChild(link); //释放标签  

Answer 2

其实你直接请求那个接口不就行了？还整这么复杂。

好了，不考虑你为什么要转一下，我们直接看问题，其实可以想到了，肯定是你数据没传对，才导致的问题。所以你看看network带的数据对吗？服务端确定收到数据了吗？还有你这个难道不应该是get嘛？

 // 导出
    export(params){
        return new Promise((resolve) => {
            axios
            .post(`${audit}/accessTask/exportExcel`, params, {responseType: 'arraybuffer'}).then(res=>{
                resolve(res)
            })
        });
    }