0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

57日目 Javascriptでファイルは読めるが書き出せなさそう。

Posted at

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時間)

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?