JavaScriptでCSVファイルを非同期に読み込む

f:id:rankasan:20170315090213j:plain

JavaScriptでホストにあるCSV形式ファイルを、非同期で読み込む方法です。配列に読み込むので、テーブル展開するなどの操作を容易にできます。サンプルコードはカンマ区切り、改行LF(CRLF)のシンプルなCSV形式ファイルを想定しています

サンプルコード

引数のurlへXMLHttpRequest.openで非同期にてリクエスト、XMLHttpRequest.onloadイベントで読み込み結果をハンドル。後は読み込んだXMLHttpRequest.responseTextを2次元配列へ変換しています

XMLHttpRequestの同期通信はユーザエクスペリエンスに影響があるとしてduplicatedになっています。要するに通信完了までユーザが操作できなくなるからですね。なので非同期にして、コールバックで読み込み結果を返しています

使い方

使い方はこんな感じ

jQueryなら$.getや$.ajaxを使ってよりシンプルに書けますね

プライバシーポリシー