文档章节

我也太牛了,解决了浏览器中,前台导出csv格式,UTF-8编码,且excek打开不乱码!

noonoo
 noonoo
发布于 2015/01/30 12:41
字数 871
阅读 6123
收藏 23

ExcellentExport.js的方法,利用base64下载文件。支持chrome ,opera,firefox. 于是决定拿来为我所用!

说明一下,这个js的好处是:一句js脚本,就能前台下载,完全无须后台。

但外国人不了解中文的csv用excel打开直接乱码。 但用记事本打开,再直接保存,或另存为ansi都可以让中文不乱码。

js里默认应该是utf-8,昨天试了用utf-8转gb2312,失败了!

于是找到这个:

utf-8保存的csv格式要让Excel正常打开的话,必须加入在文件最前面加入BOM(Byte order mark),具体楼主你可以搜索一下关于BOM的介绍。

ANSI的话是可以做到正常显示和保存,但是这是有前提的,就是必须在你的电脑(区域和语言设置)把对非Unicode字符处理设置为Chinese,如果是English的话,显示照样是乱码。

Unicode的csv,Excel就根本不支持,打开虽然可以显示不乱码,但是已经不是按逗号显示在不同的单元格里面了,而是按行显示在第一个单元格里面。     

再找到这个:

什么是BOM
    BOM(byte-order mark),即字节顺序标记,它是插入到以UTF-8、UTF16或UTF-32编码Unicode文件开头的特殊标记,用来识别Unicode文件的编码类型。具体编码如下表:
BOM                  Encoding 
EF BB BF         UTF-8
FE FF                UTF-16 (big-endian)
FF FE                UTF-16 (little-endian)
00 00 FE FF     UTF-32 (big-endian)
FF FE 00 00     UTF-32 (little-endian)

   微软建议所有的 Unicode 文件应该以 ZERO WIDTH NOBREAK SPACE(U+FEFF)字符开头。这作为一个“特征符”来识别文件中使用的编码和字节顺序。BOM的本意不错,但它并不是一个通用标准,从而导致了很多不兼容的问题。

经过用winhex等验证,乱码的csv直接保存后,记事本会自动增加BOM前缀。于是弄了一上午都在想办法在“要输出的文本”前增加上EF BB BF. 弄一上午,肯定是失败啦,否则也用不了一上午。失败的方法是:

base64(String.fromCharCode(0xef, 0xbb, 0xbf) +我要输出的文本)

或是根据winhex对正确文件的显示,在里面补充一些个0x00,都不行。因为EF BB BF无论怎么加,一经编码都变成了:茂禄驴(16进制是:C3 AF C2 BB C2 BF 00).

吃过饭回来,想到BASE64可以保存图片。那么我要是用这工具分别编码一下正确和乱码的文件不就行了。

于是用:http://www.fishlee.net/Tools/GetImageBase64Code  来试了下,结果真找到了不同。

记事本另存的正确结果:77u/5bqP5Y+3LOS/oeaBrw0K5ae

直接保存,无BOM头的结果:5bqP5Y+3LOS/oeaBrw0K5ae

哈哈!把代码改为:

'77u/'+ base64(toCSV)

,解决问题! 

真是,4个字符折腾一天。真是只有4个字符。。。。。。。。

--------------------------------------

解释一下:ExcellentExport.js的思路,就是构造这样一个a标签:
<a target="_blank" href="data:application/csv;base64,5bqP5YNCg==" download="ok.csv" style="display: none;"><span>00</span></a>
把文字base64后,指定文件名,就可能通过<a>来前台下载文件了。完全无须后端。

之后最大的问题是csv乱码,遇到过的朋友一定会知道的。而js不比后台程序,转码是很不方便的。


© 著作权归作者所有

noonoo
粉丝 17
博文 72
码字总数 38771
作品 0
深圳
程序员
私信 提问
加载中

评论(7)

王棋
王棋
真的很棒!感谢分享!
Q
Qtc

引用来自“chjlu”的评论

也帮我解决了问题。牛。
请问下具体是怎么处理的,我按照提示修改之后还是乱码。能贴下你的代码吗?
chjlu
chjlu
也帮我解决了问题。牛。
开源中国匿名会员
开源中国匿名会员
papa这个库json转csv非常方便且高效。后台是可以生成csv,但是有时候查询结果随手保存,就不用再过一下后台了。
乌龟壳
乌龟壳
朋友,后台生成csv多简单的事,何必和js较劲呢
noonoo
noonoo
那我就解释一下:ExcellentExport.js的思路,就是构造这样一个a标签:
<a target="_blank" href="data:application/csv;base64,5bqP5YNCg==" download="ok.csv" style="display: none;"><span>00</span></a>
把文字base64后,指定文件名,就可能通过<a>来前台下载文件了。完全无须后端。

之后最大的问题是csv乱码,遇到过的朋友一定会知道的。而js不比后台程序,转码是很不方便的。
处处闻啼鸟
处处闻啼鸟
虽然没看懂,但是我还是要赞一个
blob 导出csv 用execl打开出现乱码

解决方式,在传入blob的字符前加”uFEFF”;,具体代码如下 ExcellentExport.js的方法,利用base64下载文件。支持chrome ,opera,firefox. 于是决定拿来为我所用! 说明一下,这个js的好处是:...

黑魔法
2016/12/07
419
0
日常导数据乱码解决方案

日常运营数据,大多时间是用脚本导出到xls,txt等格式; 中文乱码解决: 字符串都用utf-8编码 一些临时数据或者用SQL语句就可导出到,就通过mysqlBentch导出csv格式,效率更高 中文乱码解决: ubunt...

paul2011
2016/07/05
19
0
execl打开linux下cvs文件乱码问题解决办法

好久没写过文章了,今天遇到一个execl打开linux下cvs文件乱码的问题顺便记录下问题的解决办法。很多时候需要写一些脚本定时导出sql报表,导出的文件直接用execl打不开或者打开有中文乱码。如...

vzhuomu
2018/07/18
0
0
mongo数据库导出mongoexport命令的使用

我用的MongoDB管理工具是Robo3T,今天需要从数据库中将集合数据导出,但是Robo3T我不怎么会玩,好像没有直接导出的功能,于是上网查了一下,找到了mongoexport这个命令,可以轻松导出数据在m...

itzhongxin
2017/12/05
0
0
关于mysql数据库存储中文乱码的问题

前提 :1数据库和表都是utf8generalci格式2程序代码也是utf-8格式,且使用了mysqlquery("set names utf-8"); 及htmlentities ENTQUOTES,'utf-8' 结果:即使是这样 插入数据库汉字仍然在数据库......

lilugirl
2012/12/07
0
0

没有更多内容

加载失败,请刷新页面

加载更多

偶遇 JDK 1.8 还未修复的 SecureRandom.getInstance("SHA1PRNG") 之 bug

楼主今天兴高采烈的在部署环境,下载 JDK,打包项目,上传至服务器。 配置 JDK ,打包上传项目楼主就不在这里重复了,读者自行解决哈! 1. 启动项目 java -jar xxxx.jar 令楼主没有想到的是:...

Ryan-瑞恩
9分钟前
1
0
【更新】Stimulsoft Reports v2019.3.1发布,新增对OData v4的支持功能

下载Stimulsoft Report.Ultimate v2019.3.1试用版 集所有报表解决方案于一体的综合性平台 Stimulsoft Reports.Ultimate是集所有报表解决方案于一体的综合性平台,拥有在JavaScript、ASP.NET...

xiaochuachua
9分钟前
0
0
JVM源码分析之javaagent原理完全解读

JVM源码分析之javaagent原理完全解读 概述 本文重点讲述javaagent的具体实现,因为它面向的是我们Java程序员,而且agent都是用Java编写的,不需要太多的C/C++编程基础,不过这篇文章里也会讲...

BryceLoski
15分钟前
0
0
git记住密码

git取消记住密码 git config --system --unset credential.helper git记住密码 git config --global credential.helper store...

大灰狼wow
16分钟前
1
0
java 面试知识点笔记(十四)异常体系

问:Error和Exception的区别? ps:Throwable上层是Object Error:程序无法处理的系统错误,编译器不做检查 Exception:程序可以处理的异常,捕获后可能恢复 RuntimeException:不可预知的,...

断风格男丶
19分钟前
0
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部