Web 端 js 匯出csv檔案 使用a標籤

2021-06-19 05:19:07 字數 1385 閱讀 9191

匯出檔案,使用最多的方式還是伺服器端來處理。比如jsp 中使用response 的方式。

但是,有時候可能就想使用web 前端是否也可以把頁面上的內容匯出來呢? 比如說,匯出頁面的乙個**。

這個需求肯定是有答案的,只是對於各瀏覽器處理會稍微不一樣。(主要是ie 和其他瀏覽器的區別)。

在ie中使用activexobject 實現,在firefox 和chrome 中使用  a 標籤(或者js)就可以實現了。 這裡主要講一下其他瀏覽器中的實現。

直接上例子:

download

說明一下:

csv 檔案可以用excel開啟, 如果是匯出乙個table 的話,使用excel 就方便很多了。

問題是: 如何分行, 分列?

理論上 : 分列使用 , 號分割, 分行用 \n .

可以用以上方式,會發現列可以分開,但是不換行。 看上去不認識 \n.

解決方式是使用 encodeuricomponent 進行編碼/

download

以上使用的都是utf-8 編碼,理論上匯出中文應該不是問題。

但是匯出csv 格式的話, 使用excel 開啟會發現中文是亂碼,但是用其他文字程式開啟確是正常的。

原因就是少了乙個 bom頭 。  \ufeff。

加上一切都正常了,

download

這裡有兩個改變

1. 頁面的charset 需設定成gb2312

2. 加上 \ufeff bom 頭

上網搜尋一下, 有說是chrome 的 bug.

參見 stackoverflow 中的兩篇文章:

以上兩篇文章可以不去關注, 需要關注的是這個問題是否可以解決, 以及解決的方法是什麼?

直接貼解決方案:

var blob = new blob([data], ); //new way

var csvurl = url.createobjecturl(blob);

document.getelementbyid("mylink").href = csvurl;

使用blob 和url 來封裝和轉換. 問題解決。

這裡如遇中文問題, 和上面的處理方式是一樣的:

1. 頁面的charset 需設定成gb2312 (設成utf-8 也可以)

2. 加上 \ufeff bom 頭

具體的**類似:

data = "\ufeff"+data;

var blob = new blob([data], );

python 使用csv模組匯出csv檔案問題

python3中存csv亂碼的問題 with open filename,a newline encoding utf 8 sig as f 中文需要設定成utf 8格式 open 增加encoding得設定即可 python2不支援 python2中中文亂碼問題 用記事本開啟匯出得csv檔案,另存...

匯出csv檔案 使用a標籤

productscsv e this.state 表頭 const thead 時間,key,服務介面,呼叫量 n 資料初始值 let str thead 內資料格式化 function tbcell cell let str thead 值1,值2,值3,值4,值5,值6,值7 n值1,值2,值3...

ORACLE匯出CSV檔案

oracle的匯出功能會經常使用,也同樣經常會有需求進行匯出為csv檔案,用於往別的資料庫進行遷移,本次例項及在oracle實現匯出csv檔案操作。sqlplus as sysdba sql create or replace directory out path as home wenxuecha...