jQuery だけで CSVファイル作成とダウンロードを実装する

firebase で作ったシステムの管理画面に csvをダウンロードする 機能をつける必要があったので調べて実装したコード。

環境

• jQuery 3.2.1
• jQuery CSV

コード

クリックイベント等で下の内容を実装するとjavascriptだけでファイルダウンロードが実装できました。jQuery CSVで作ったCSV文字列を Blob に入れて Aタグのhrefとして処理するコードです。

//CSVダウンロード処理
const serialcode = "ABCDEFG";
const details = [{key:"codeAAAAA",value:"AAAA"},{key:"codeBBBB",value:"BBBB"}];
const content = $.csv.fromObjects(details);
const blob = new Blob([ content ], { "type" : "text/csv" });
$("<a></a>", {href: window.URL.createObjectURL(blob),
              download: serialcode+".csv",
              target: "_blank"})[0].click();

ABCDEFG.csv

key,value
codeAAAAA,AAAA
codeBBBB,BBBB