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

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不比后台程序,转码是很不方便的。

时间: 2024-08-28 07:11:54

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

解决webkit浏览器中js方法中使用window.event提示未定义的问题

这实际上是一个浏览器兼容性问题,根源百度中一大堆,简要说就是ie中event对象是全局变量,所以哪里都能使用到,但是webkit内核的浏览器中却不存在这个全局变量event,而是以一个隐式的局部变量的形式传入(后文会详说). function myfunc(param){ alert(window.event); } //ie中 <input type="button" onclick="myfunc('testie')" > //一切正常 //webk

xml文件在浏览器中显示成xml格式

在浏览器中对xml文件的访问,期望为xml格式,却没有 期望: 实际如下: 原来是要在IIS服务器中修改下该站点的Mine中相应文件对应的类型 右击->编辑

php导出csv格式数据,以及将数字转换成文本解决办法昨啄钻纂转钻

http://www.jiaoyou8.com/friends_diary/qingsiwen/0_0_0/view_0018947113_no_0_0.2015-01-31.html http://www.jiaoyou8.com/friends_diary/qingsiwen/0_0_0/view_0018947097_no_0_0.2015-01-31.html http://www.jiaoyou8.com/friends_diary/qingsiwen/0_0_0/view_00189

IE浏览器中 $.ajax返回uindefined 其他浏览器正常

怎么解决IE浏览器中ajax返回undefined问题_JavaScript教程_B5教程网 出现这样的问题,是因为文件保存编码和页面显示编码不一至造成的.各种浏览器,没有统一的规范,特别是IE,做浏览器兼容时,是比较郁闷的.下面模拟一下这个问题. 1,test.php采用gbk或者gb2312编码 <?php  header("content-Type: text/html; charset=utf8");//设置页面显示为utf8  echo "aaa";

php提取csv格式文件中的字符串出现的问题及解决办法

php带csv格式的数据要用到fgetcsv()函数. 用这下面的语句 $hd=fopen('test.csv','r'); $buf=fgetcsv($hd,1000,','); 打开一个test.csv格式的文件,文件中的内容以","号分开. 取出的第一行代表自动含义,比如 id,messaget,time等等. 从第二行开始表示具体的数据,比如1,消息,12:00. if($buf[1]=="some messages") echo "yes&quo

浏览器中查看HTTP的头部文件

本文以chrome浏览器为例,来讲解下在浏览器中,如何查看http的头部文件. 1.打开chrome浏览器,输入地址,如下图所示. 2.鼠标右击,在右键菜单中选择[检查],如下图所示. 3.选择"Network"后,输入Ctrl+R重新加载页面,按照如下选择顺序依次选择后点击[Response Headers]即可查看HTTP的头文件,如下图所示. 原文地址:https://www.cnblogs.com/mayugang/p/10346144.html

IE浏览器中Image对象onload失效的解决办法

作为WEB设计者,为了在网页展示上加强用户体验,经常会利用图象载入显示状态方法,这自然需要Image对象的onload事件. 在firefox浏览器下完成开发后,可是在IE浏览器中进行调试总不能被调用.不管是最新版的IE8还是旧版本的IE7和IE6都无效,最初的代码简化后如下: var img = new Image(); img.src = "test.gif"; img.onload = function(){ alert(this.src); //other }; 简单看过以后貌

解决微信浏览器内video全屏问题

前端离职,让我写个视频播放页面,木办法只有我来搞了. 默认用h5的 video标签 测试时候发现微信浏览器内访问video自动全屏播放. 搜了下 webkit-playsinline="true" playsinline="true" x-webkit-airplay="true" x5-video-player-type="h5" x5-video-player-fullscreen="true" x5-

Uploadify—借助Uploadify插件实现图片预览时如何解决Chrome浏览器报“喔唷,崩溃啦”

今天借助Uploadify插件实现了图片预览及其上传的功能,可是在Chrome浏览器中会时不时地出现如下图所示的情况: 解决方法:使用这种方法引用该插件js文件: <script type="text/javascript"> document.write("<script type='text/javascript' src='<%=basePath %>js/uploadify/jquery.uploadify.min.js?" +