Javascriptで作ったサイトにCSVを読み書きする機能を追加したいと思ったらどハマりしてしまいました。
###まずは読み込み
function getCsv(url){
//CSVファイルを文字列で取得。
var txt = new XMLHttpRequest();
txt.open('get', url, false);
txt.send();
//改行ごとに配列化
var arr = txt.responseText.split('\n');
//1次元配列を2次元配列に変換
var res = [];
for(var i = 0; i < arr.length; i++){
//空白行が出てきた時点で終了
if(arr[i] == '') break;
//","ごとに配列化
res[i] = arr[i].split(',');
}
return res;
}
getCsv("test.csv");
これでイケると思ったら全然読まない。コンソールにはこんなエラーが出ていました。
from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.
セキュリティ上の理由でローカルファイルへのアクセスをブロックしているようです。
このブロックを許可するオプション付きでChromeを起動して読ませるとできるらしい。
Start Google Chrome on Mac with command line switches
sudo /Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --args -allow-file-access-from-files
できました!
てすが、いつもこのオプション付きでChromeを立ち上げてくださいっていうの、あんまり現実的ではない感じです。
#書き込み
これが大変でした。
Javascriptからファイルを書き出す方法がみつからず。
①ダウンロード
できそう。だけどできればバックグラウンドで動かしたい。
②Node.jsで書き込む
サーバー側で上げられればありかも。
③FilesystemAPI
任意のファイルの編集は無理。サンドボックス内のみ可能。
いろいろ調べたのですがJavascriptだけでファイルの書き込みは難しそうです。
(所要時間2時間)