解决方法在最下面,可以直接去看【解决方法-->正解】
【问题描述】
使用blob导出.xlsx文件打开后出错,如下:
WPS表格 在试图打开文件时遇到错误。请尝试以下方法。
检查文档或驱动器得到访问权限。
确保有足够的内存和磁盘空间。
确保此文件是可以识别的格式。
前端查看response响应值如下:
可以看出,response.data是一串乱码,并不是自己要求的blob类型。
这串乱码被放到了.xlsx文件中当然就打不开拉。可以用notepad++打开导出的.xlsx文件,就是这串乱码。
response.data的值如下:
抄一下别人的图清楚点:(图转自:https://blog.csdn.net/qq_38804584/article/details/109238794)
【问题解决】
1.失败尝试一
首先我参考了https://blog.csdn.net/csu_passer/article/details/91952460
将new Blob([data], {type: 'application/vnd.ms-excel'}))
改为了:new Blob(['\uFEFF' +data], {type: application/vnd.ms-excel;charset=utf-8'}))
结果呢,确实是打开文件了,但是打开后是一串乱码。修改这句话的作用其实就是把乱码当作文本放在了excel中,打开excel后显示的文本就是response.data中的乱码。
打开后就是这样:(图转自:https://blog.csdn.net/qq_38804584/article/details/109238794)
2.失败尝试一
然后参考了https://blog.csdn.net/qq_38804584/article/details/109238794
博主说:
然后我找啊找,找了很久,网上方法都尝试了。最后看到网上有盆友说可能是使用了mock模拟的原因,我就把mock的使用关掉了(没有设置开关的盆友就可以在引入的位置注释)。
然后我并没找到这个变量。
日后我会再找找自己的应该修改什么变量。
3.正解
参考了这位博主文章:https://blog.csdn.net/belove_lucy/article/details/95476669
博主说:
之前都是正常的,昨天测了一个下午都失败了,前端拿来的数据变成json格式,并不是规定好的blob类型。。。
最后才发现是因为项目被我引进了mock,关掉就好了
个人感觉,是mock拦截所有的请求(不管他是不是被mock的接口),将返回数据类型统一转了json格式。。。据说mock还会私自更改其他请求配置?
我查询问题的链接:https://github.com/PanJiaChen/vue-element-admin/issues/562
点开链接看看,发现有人直接将import './mock'注释掉了,如图:
接下来将前端项目中main.js的 import './mock'注释掉,成功解决问题。
注释掉后response.data返回的值应差不多是下面这个样子的,注意这里的data是data:Blob(5432)了。