-
vue下载excel文件乱码问题,亲测有效
2020-03-12 09:53:37项目中使用vue,在下载excel文件的时候,遇到了乱码问题,困扰了好久,查了网上的很多资料都没用,后来查阅了一篇博客,解决了问题。后端是流的形式返回的。 我尝试把返回类型(responseType: 'blob')写在接口调用...项目中使用vue,在下载excel文件的时候,遇到了乱码问题,困扰了好久,查了网上的很多资料都没用,后来查阅了一篇博客,解决了问题。后端是流的形式返回的。
我尝试把返回类型(responseType: 'blob')写在接口调用的地方,发现还是乱码。
后来把返回类型(responseType: 'blob')写在接口定义的地方就好了,如图1
图1
图2
-
下载.csv文件,excel打开乱码
2019-07-11 15:17:55遇到的问题:下载后的文件用office excel打开乱码,wps及其他正常 后端解决方式: 将编码改为gbk编码 前端解决方式: 就很麻烦了,如下 第一步:将blob格式的type改为’text/csv’,再进行下载 如果不做这一步,进行...下载.csv文件,excel打开乱码
功能:下载csv文件,并查看
环境:前端axios请求,后端java语言遇到的问题:下载后的文件用office excel打开乱码,wps及其他正常
后端解决方式: 将编码改为gbk编码
前端解决方式: 就很麻烦了,如下
第一步:将blob格式的type改为’text/csv’,再进行下载
如果不做这一步,进行导入csv的话,excel会出现如图错误
原因应该是和换行符有关系,可查看文章:excel导入csv数据出错:此文本文件包含的数据无法放置在一个工作表中。。。所以我认为这一步解决的是换行符的问题
第二步:
1、打开excel
2、点击数据里的从文本
3、改变编码格式为utf-8,点击下一步
4、设置分隔符
5、点击完成
我认为这一步改变的应该是文件的编码格式
当然最终这个问题用后端的解决方式才是正道,哈哈
-
使用axios下载excel文件解决乱码问题
2020-07-29 10:06:03然后通过 标签的特性来自动点击下载文件; 如果要兼容IE则需要利用navigator.msSaveOrOpenBlob方法; 兼容Firefox 须将 标签添加到body中,最后再移除 标签 例子: // axios config config = { responseType: ...- 须将axios 配置中的responseType设置为arraybuffer,这样就不会让表格出现乱码现象;
- 如果要动态设置文件名则需要让后台将名字设置到响应头中,否则将是一个乱码的文件名;
- 然后通过 标签的特性来自动点击下载文件;
- 如果要兼容IE则需要利用navigator.msSaveOrOpenBlob方法;
- 兼容Firefox 须将 标签添加到body中,最后再移除 标签
例子:
// axios config config = { responseType: 'arraybuffer' } // 返回数据处理 getUserInfoExport(data).then(({data,headers}) => { let blob = new Blob([data], { type: 'application/vnd.ms-excel' }) // 将服务端返回的文件流(二进制)excel文件转化为blob let fileName = headers.filename if (window.navigator && window.navigator.msSaveOrOpenBlob) { // IE window.navigator.msSaveOrOpenBlob(blob, fileName) } else { let objectUrl = (window.URL || window.webkitURL).createObjectURL(blob) let downFile = document.createElement('a') downFile.style.display = 'none' downFile.href = objectUrl downFile.download = fileName // 下载后文件名 document.body.appendChild(downFile) downFile.click() document.body.removeChild(downFile) // 下载完成移除元素 // window.location.href = objectUrl window.URL.revokeObjectURL(objectUrl) // 只要映射存在,Blob就不能进行垃圾回收,因此一旦不再需要引用,就必须小心撤销URL,释放掉blob对象。 } })
-
java 下载Excel 文件名称中文乱码问题
2019-03-25 14:11:27问题:java中用poi API进行Excel文件的下载,下载操作可以执行,可是最后发现下载的文件名称若为中文,则会出现乱码。 解决办法: 原因:ie浏览器下自动转码格式为gbk,而火狐、chrome等浏览器下的自动转码格式...问题:java中用poi API进行Excel文件的下载,下载操作可以执行,可是最后发现下载的文件名称若为中文,则会出现乱码。
解决办法:
原因:ie浏览器下自动转码格式为gbk,而火狐、chrome等浏览器下的自动转码格式为utf-8
因而,在生成下载文件名时,只需根据不同的浏览器,对文件名进行转码即可。
直接上代码:
这里只贴生成文件名的代码:
/** * 下载文件输出流 文件头设置 * @param response 服务器响应 * @param request 客户端请求 * @param contentType 头信息 * @param exportDto 下载实体信息 * @return * @throws Exception */ private static OutputStream getWriteOutputStream(HttpServletResponse response, HttpServletRequest request) throws Exception { response.reset();// 清空输出流 response.setContentType("application/ms-excel;charset=utf-8"); String fileName = encodeFileName("这里是你的文件名", request); // attachment这个代表要下载的,如果去掉就直接打开了(attachment-作为附件下载,inline-在线打开) // filename是文件名,另存为或者下载时,为默认的文件名 response.addHeader("Content-Disposition", "attachment; filename="+fileName);// IE下GBK,但是FireFox下UTF-8 return response.getOutputStream(); } /** * @param fileNames * @param request * @Description: 导出文件转换文件名称编码 */ public static String encodeFileName(String fileNames, HttpServletRequest request) { String codedFilename = null; try { String agent = request.getHeader("USER-AGENT"); if (null != agent && -1 != agent.indexOf("MSIE") || null != agent && -1 != agent.indexOf("Trident") || null != agent && -1 != agent.indexOf("Edge")) {// ie浏览器及Edge浏览器 String name = java.net.URLEncoder.encode(fileNames, "UTF-8"); codedFilename = name; } else if (null != agent && -1 != agent.indexOf("Mozilla")) { // 火狐,Chrome等浏览器 codedFilename = new String(fileNames.getBytes("UTF-8"), "iso-8859-1"); } } catch (Exception e) { e.printStackTrace(); } return codedFilename; }
-
vue下载excel文件接口返回乱码问题
2020-07-16 22:04:43下载excel文件不成功 谷歌浏览器Network查看调用接口A的Preview: 二、解决办法 1.发送post请求时添加:responseType: 'blob' 2.调用接口后添加: let blob = new Blob([res.data], { type: 'application/vnd.ms-... -
Vue 采用blob下载后端返回的excel流文件乱码问题
2019-09-26 12:46:39没有文件服务器, 前后端采用文件流方式下载,后端返回二进制乱码时,前端使用blob对象进行处理 2.采用的是axios请求方式 this.$http.post("download", { fileName: file.filename }) .then(function(response) { let ... -
SpringBoot+Vue下载Excel文件流(No converter、Excel乱码)
2020-08-14 23:53:51后端使用了Hutool工具提供的Excel文件流下载。 No converter 问题: 后端控制台出现No converter for [class com.common.lang.Result] with preset Content-Type 'application/vnd.ms-excel;charset=utf-8'的错误 -
利用swagger组件测试excel下载,打开文件乱码。
2019-08-17 16:42:12最近项目遇到个问题,就是利用swagger下载excel时,得到的文件打开总是乱码,首先怀疑是response的content-type有问题,将application试遍了,“x-msdownload”,“vnd.ms-excel”,“vnd.openxmlformats-... -
关于vue需要传参导出下载后台传出的excel流文件乱码问题
2020-01-16 10:46:19业务场景是需要想后台传一些检索的参数, 后台返回对应的查到的数据生成excel文件,然后通过文件流的方式交给前台。 第一种方法。 我这边能想到的两种办法第一种是,因为是接口是get类型,所以最简单的就是window.... -
Java下载Excel时文件名称乱码
2020-12-08 17:59:04遇见问题就解决问题,根据实际的问题,找或想实际的解决方案。 动机 写此文章目的,为了让更多出现此问题的人能够快速的找到解决方法(本人亲测)。 解决方案 长话短说... -
POI、easyExcel等下载excel文件,内容出现乱码的另类解决思路
2019-01-20 22:59:33最近项目中需要一个导出excel的 功能,但是呢,开发完成之后,可以下载,却出现下载下来的文件内容一直出现乱码的情况,是那种“锟斤铐”这样的乱码 文件。 经过我严密的分析,以及查询各种资料,乱码的原因首先... -
xlsx文件打开乱码_excel打开xls文件全是乱码怎么办?excel打开xls乱码的修复方法
2020-12-22 03:16:23excel打开xls全是乱码怎么办?excel文档格式向来兼容性奇差,各种不兼容问题令文员们头疼...软件名称:Recovery for Excel(excel文件修复工具) v6.0 官方英文安装版软件大小:1.25MB更新时间:2017-06-14立即下载e... -
vue下载excel文件乱码 mock.js_豪横!3 分钟快速构建一个 Vue 工程,附详细代码
2020-11-12 18:30:32SpreadJS是一款基于 HTML5 的纯前端表格控件,兼容 450 种以上的 Excel 公式,具备“高性能、跨平台、与 Excel 高度兼容”的产品特性 可为用户带来亲切、易用的使用体验,并满足 Web Excel组件开发、表格文档协同... -
element upload文件上传组件下载excel乱码问题总结
2019-11-29 14:54:46element upload文件上传组件下载excel乱码问题总结 大部分excel下载乱码的原因是没有设置responseType。而element的默认上传行为是不能设置responseType的。所以这里展示如何自定义实现设置responseType以解决乱码... -
[问题探讨]VUE项目下载excel,通过window.open可以下载,通过axios+blob下载的文件乱码
2020-05-07 18:51:46VUE项目,下载excel需求,通过window.open可以正常下载正常显示,通过axios+blob下载的文件乱码 前端代码: 1,axios部分(request.js) const service = axios.create({ timeout: 25000 // request timeout }) ........ -
Linux系统中导出的CSV文件在Excel显示乱码解决方式
2019-03-14 08:39:41Windows上EXCEL打开乱码解决方法 方法一 下载Notepad++软件,并用该软件...打开一份空白的Excel文件 在工具栏中选择数据--自文本 选择对应的csv文件打开 在文本导入向导处,更改文件原始格式为65001 并选择分隔... -
使用POI,excel文件下载内容乱码解决方案
2020-08-13 23:40:40有些朋友在使用POI进行Excel导出时,发现内容是乱码的,如下: 然后请求的参数的中,添加如下参数: (1)responseType: 'arraybuffer' (2)或者是responseType: 'blob' 我测试的时候,添加两种response... -
java下载excel文件在firefox中文件名为乱码
2016-10-09 14:45:08转载自:... 现象:使用jboss开发的下载excel文件功能,使用中文文件名,在IE里面正常,firefox里面文件名乱码 解决: String agent = request.getHeader("USER-AGENT")).toLowerCase(); / -
web下载数据成Excel文件时中文乱码
2017-03-16 16:57:02下载文件的文件名出现乱码现象。 错误写法:response.addHeader("Content-Disposition","attachment; filename=/""+ new String(("数据元素简表").getBytes(),"iso8859-1")+ "/""); 正确写法:response.add... -
php 下载已经上传好的excel文件出现乱码------解决办法
2017-10-31 14:22:00这两天项目交付,把代码部署到服务器上后下载的excel模板居然打不开了,后面把代码copy到本地也是文件能正常下载,但是打不开。。。如图: 后面到网上百度了找到了解决的办法 -----在输出文件之前清除缓存(ob_... -
MVC下载Excel文件:js接受乱码 简单处理办法
2015-01-18 18:25:06在做考试系统的时候,需要向题库里面批量导入试题。所以在导题之前需要下载一个Excel模版。 在MVC中下载模版,需要创建一个Excel模版,然后发到前台。...如果是单纯的生成一个特定的Excel的文件,然后发到前台,即没 -
Vue 采用blob下载后端返回的excel流或者pdf流文件乱码问题解决方案
2020-11-28 13:25:48网上有很多pdf或者excel转后台返回的流文件方法,但是下载或者预览就特么炸裂了,打开或者预览全是乱码,现在我来填坑。。。 预览pdf如下图: 这个charset=utf-8一定要添加,不添加可能乱码,如果后台返回的格式... -
下载Excel文件时,出现下载的文件名乱码, 求教
2012-08-14 22:34:51下载的文件名乱码 [img=http://img.my.csdn.net/uploads/201208/14/1344955406_8993.jpg][/img] 后台代码 [img=http://img.my.csdn.net/uploads/201208/14/1344955459_9880.jpg][/img] -
解决不同浏览器下载excel文件中文名称乱码问题
2013-11-07 15:29:00IE浏览器对文件格式审查最严格,在从网页导出Excel的时候,需要对文件名称指定编码类型(UTF-8) HttpUtility.UrlEncode(strFileName, System.Text.Encoding.UTF8) 而Firefox则不能指定编码类型,Chrome... -
EXCEL打开CSV文件乱码的解决方法
2012-07-24 09:58:30从网页上导出数据文件存储为CSV格式的文件,使用记事本打开文字显示没有问题,使用EXCEL打开出现乱码的情况。 【故障原因分析】 此种情况一般是导出的文件编码的问题。在简体中文环境下,EXCEL打开的CSV文件默认... -
jSP程序页面中下载打开Word,Excel,powerpoint文件乱码的问题
2012-12-10 15:01:53在运行JSP程序时在页面中涉及到下载打开Word,Excel,powerpoint文档出现乱码的问题的解决办法: 找到Tomcat安装目录,找到Conf\web.xml 文件 在里边添加mime-mapping参数设置,只要把以下几个添加到WEB.xml中... -
IE中点击链接下载EXCEL文件直接以乱码方式打开解决
2013-04-02 13:01:50我需要在页面上通过javascript控制,点击一个链接下载excel文件模板,总觉得方法都写对了,可每次点击都是新开一个窗口,显示的全是乱码。几日以来一直被这个问题困扰,今天无意中得知这个方法,试了一下,果然如此... -
vue中使用axios下载excel二进制文件 出现乱码问题的解决方法
2020-11-26 16:30:02在main.js中是否引入了和axios有冲突的插件,我当时因为引入了mock所以这么多次都无果,一直是乱码 如果还是不ok的话可以尝试修改 let blob = new Blob([res.data], {type: "application/vnd.ms-excel"}); ...
收藏数
482
精华内容
192