1

HTML5ファイルAPIを使用してcsvファイルを解析し、出力を非常にうまく表示する素晴らしいデモを見つけました。

http://rohitrox.github.io/js_csv/

ローカル システムからファイルをロードしたくないが、test.csv などの入力する静的ファイルがあった場合はどうなりますか。これはセキュリティ上の問題であることはわかっていますが、回避策はありますか?

function handleFileSelect(){
  var file = document.getElementById("the_file").files[0];
  var reader = new FileReader();
  var link_reg = /(http:\/\/|https:\/\/)/i;
  reader.onload = function(file) {
              var content = file.target.result;
              var rows = file.target.result.split(/[\r\n|\n]+/);
              var table = document.createElement('table');

              for (var i = 0; i < rows.length; i++){
                var tr = document.createElement('tr');
                var arr = rows[i].split(',');

                for (var j = 0; j < arr.length; j++){
                  if (i==0)
                    var td = document.createElement('th');
                  else
                    var td = document.createElement('td');

                  if( link_reg.test(arr[j]) ){
                    var a = document.createElement('a');
                    a.href = arr[j];
                    a.target = "_blank";
                    a.innerHTML = arr[j];
                    td.appendChild(a);
                  }else{
                    td.innerHTML = arr[j];
                  }
                  tr.appendChild(td);
                }

                table.appendChild(tr);
              }

              document.getElementById('list').appendChild(table);
          };
  reader.readAsText(file);
 }
 document.getElementById('the_form').addEventListener('submit', handleFileSelect, false);
 document.getElementById('the_file').addEventListener('change', fileInfo, false);
4

2 に答える 2

0

いいえ。これを行う方法はありません。毎回手動でローカル ファイルを選択する必要があります。そうしないと、すべてのサイトがあなたの許可なしにあなたのファイルにアクセスする可能性があります.

于 2014-01-27T11:30:34.737 に答える
0

実際、外部の URL からテキスト ファイルを要求することはそれほど珍しいことではありません。実際、これは File API よりも前のものです。「AJAX」というバズワードを聞いたことがありますか?

非同期リクエストは、適切なクロスブラウザーの方法で行うにはもう少し複雑です。そのため、他の機能の中でも特に、それを行う簡単な方法を含む多くのライブラリがあります。「$」記号で認識されることが多い JQuery は一例ですが、「AJAX ライブラリ」をググって独自のものを検索できます。

$.ajax({
    url: 'files/file.csv', // this will automatically be seen as a relative URL
      //to the page you've navigated to, ie "http://www.google.com/files/file.csv"
    success: function(data) {
        // This function won't execute right away, but when the server's
        // text response comes back.
        // "data" will be a string containing the text of the response.
        document.getElementById("csvOutputDisplay").textContent = data;
    }
}
于 2013-06-21T19:22:36.000 に答える