Vue结合后台导入导出Excel问题详解后续
程序员文章站
2022-03-20 21:59:05
接前几天写的一篇博客 https://www.cnblogs.com/ttjm/p/11307462.html 在ie浏览器测试发现打不开,经调查问题如下 1 如果在本地开发调试,请求接口报错如下 经查是项目启动和接口地址不同源ie有所限制,只需npm run build 放到服务器上测试即可 2 ......
接前几天写的一篇博客
在ie浏览器测试发现打不开,经调查问题如下
1 如果在本地开发调试,请求接口报错如下
经查是项目启动和接口地址不同源ie有所限制,只需npm run build 放到服务器上测试即可
2 ie对get请求中url长度的限制是2083字节(2k+35)(我项目的参数超过此字节)
3 ie对get请求中参数可能不能有中文,(带验证)
故代码修改如下
axios({ method: 'post',//请求方法改为post url: 'http://localhost:19090/exportuser',//这个是请求的地址 params: {//这个是请求的参数 email: this.email, startregisterdate: this.registerstarttime, endregisterdate: this.registerendtime }, responsetype: 'blob' }).then((res) => { let blob = new blob([res.data],{type: 'application/vnd.ms-excel'}); if (window.navigator.mssaveblob) { //ie以及ie内核的浏览器使用 try { window.navigator.mssaveblob(blob, '支出明细' + '.xls'); // window.navigator.mssaveoropenblob(response, filenm); //filenm是文件的名字 } catch (e) { console.log(e); } }else{ const link = document.createelement('a') link.style.display = 'none' link.href = url.createobjecturl(blob); let num = '' for(let i=0;i < 10;i++){ num += math.ceil(math.random() * 10) } link.setattribute('download', '支出明细' + '.xls') document.body.appendchild(link) link.click() document.body.removechild(link) } }).catch(error => { console.log(error) })
如果是get请求,请求头不需要额外加参数,直接 window.location.href='http://localhost:19090/exportuser?email='+email+"&start="+start ,(参数中的参数转码或者和后台商量不用中文即可)打开一个地址即可