JavaScriptでShift_JISのcsvを読み込む(文字化け対策)

最終更新日

rakutencardtreemap

楽天カードの利用明細csvを読みこんでツリーマップを表示するコードを書いてみたわけですが、明細csvの文字コードがShiftJISだったため、思っていたより手間取りました。

備忘録としてメモっておきます。

csv読み込み

UTF8のcsvであれば、下記の方法でinput type=fileから読み込むことができます。

しかし、csvの文字コードがshiftJISだと、出力結果が文字化けします。

文字コード変換ライブラリ

JavaScriptで文字コードを変換するライブラリを作成されている方がいたので、今回はこちらを使わせていただきました。

JavaScriptで文字コード変換ライブラリ作ってみた | 圧縮電子どうのこうの

ただ一点注意すべきポイントがあって、FileReaderでデータを読み込む際readAsTextメソッドではなくreadAsBinaryStringメソッドを使う必要があります。これに気付くまでに結構時間がかかりました orz

csv(shiftJIS)読み込み

ShiftJISのcsvデータを読み込むサンプルは以下となります。