ExcellentExport.js的方法,利用base64下載文件。支持chrome ,opera,firefox. 于是決定拿來為我所用!
說明一下,這個js的好處是:一句js腳本,就能前臺下載,完全無須后臺。
但外國人不了解中文的csv用excel打開直接亂碼。 但用記事本打開,再直接保存,或另存為ansi都可以讓中文不亂碼。
js里默認(rèn)應(yīng)該是utf-8,昨天試了用utf-8轉(zhuǎn)gb2312,失敗了!
于是找到這個:
utf-8保存的csv格式要讓Excel正常打開的話,必須加入在文件最前面加入BOM(Byte order mark),具體樓主你可以搜索一下關(guān)于BOM的介紹。
ANSI的話是可以做到正常顯示和保存,但是這是有前提的,就是必須在你的電腦(區(qū)域和語言設(shè)置)把對非Unicode字符處理設(shè)置為Chinese,如果是English的話,顯示照樣是亂碼。
Unicode的csv,Excel就根本不支持,打開雖然可以顯示不亂碼,但是已經(jīng)不是按逗號顯示在不同的單元格里面了,而是按行顯示在第一個單元格里面。
再找到這個:
什么是BOM
BOM(byte-order mark),即字節(jié)順序標(biāo)記,它是插入到以UTF-8、UTF16或UTF-32編碼Unicode文件開頭的特殊標(biāo)記,用來識別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 文件應(yīng)該以 ZERO WIDTH NOBREAK SPACE(U FEFF)字符開頭。這作為一個“特征符”來識別文件中使用的編碼和字節(jié)順序。BOM的本意不錯,但它并不是一個通用標(biāo)準(zhǔn),從而導(dǎo)致了很多不兼容的問題。
經(jīng)過用winhex等驗證,亂碼的csv直接保存后,記事本會自動增加BOM前綴。于是弄了一上午都在想辦法在“要輸出的文本”前增加上EF BB BF. 弄一上午,肯定是失敗啦,否則也用不了一上午。失敗的方法是:
base64(String.fromCharCode(0xef, 0xbb, 0xbf) 我要輸出的文本)
或是根據(jù)winhex對正確文件的顯示,在里面補(bǔ)充一些個0x00,都不行。因為EF BB BF無論怎么加,一經(jīng)編碼都變成了:茂祿驢(16進(jìn)制是:C3 AF C2 BB C2 BF 00).
吃過飯回來,想到BASE64可以保存圖片。那么我要是用這工具分別編碼一下正確和亂碼的文件不就行了。
于是用:http://www.fishlee.net/Tools/GetImageBase64Code 來試了下,結(jié)果真找到了不同。
記事本另存的正確結(jié)果:77u/5bqP5Y 3LOS/oeaBrw0K5ae
直接保存,無BOM頭的結(jié)果:5bqP5Y 3LOS/oeaBrw0K5ae
哈哈!把代碼改為:
'77u/' base64(toCSV)
,解決問題!
真是,4個字符折騰一天。真是只有4個字符。。。。。。。。
--------------------------------------
解釋一下:ExcellentExport.js的思路,就是構(gòu)造這樣一個a標(biāo)簽:
<a target='_blank' href='data:application/csv;base64,5bqP5YNCg==' download='ok.csv' style='display: none;'><span>00</span></a>
把文字base64后,指定文件名,就可能通過<a>來前臺下載文件了。完全無須后端。
之后最大的問題是csv亂碼,遇到過的朋友一定會知道的。而js不比后臺程序,轉(zhuǎn)碼是很不方便的。
聯(lián)系客服