サーバーを使わずにJavascriptを使って読み書きするローカルファイルなどのファイル操作

Question

私は、Javaスクリプトを使ってファイル操作システムを試しています。私はW3CファイルのAPI（https://www.w3.org/TR/FileAPI/）から呼ばれたように、我々は唯一の

var file = "test.txt"; 
function readTextFile(file) { 
    var readFile;  
    if(window.XMLHttpRequest){ 
     // for new browsers 
     readFile = new XMLHttpRequest(); 
    }else{ 
     //for old browsers like IE5 or IE6 
     readFile = new ActiveXObject("Microsoft.XMLHTTP"); 
    }  
    readFile.open("GET", file, true); 
    readFile.onreadystatechange = function() { 
     if(readFile.readyState === 4) { 
     if(readFile.status === 200 || readFile.status == 0) { 
      //text will be displayed that read from the file 
      console.log(readFile.responseText); 
     } 
     } 
    } 
    readFile.send(null); 
} 

のようなローカルファイルを読み取ることができますが、サーバーなしでファイルに書き込むためにはオプションがありませんに見えます。私はhttp://www.stackoverflow.com/のようなウェブサイトからソリューションを取り出そうとしていましたが、この調査ではほとんど可能性はないと述べています。私が得たもの例えば

は、それがエラーを示しhttps://gist.github.com/Arahnoid/9925725

から

ある "TypeError例外を：。file.openは関数ではありません"

私の質問は、です。サーバー側のスクリプトを使用せずにローカルファイルに対してファイル操作（書き込みファイルについてのみ尋ねること）が可能ですか？

PHP、Node.jsなどのサーバースクリプト言語を使用してファイル操作を行うことができます。

ありがとうございます。

Answer 1

あなたのコードでは、ローカルファイル（test.txt）からの読み込みではなく、Ajax GET要求をサーバー側に送信し、サーバー側でファイルを読み取ります。

ローカルファイル（ブラウザがインストールされているマシンに保存されているファイル）を読み取るには、現在のコードで使用されていないFileAPIを使用する必要があります。

ファイルをローカルに書き込むには、JavaScriptを使用して直接書き込むことはできません。さもなければ、それは巨大なセキュリティ脆弱性になります。ただし、FileオブジェクトからURLを生成し、そのURLをhref属性の<a>タグとして使用すると、ユーザーはダウンロードして「ローカルに書き込む」ことができます。あなたは、ブラウザがインストールされているマシン上のファイルを意味しています、「ローカルファイル」とは、

var inputElement = document.getElementById("input"); 
 
var reader = new FileReader(); 
 
var downloadLink = document.getElementById('downloadLink'); 
 

 
reader.onloadend = function(){ 
 
    console.log(reader.result); 
 
} 
 
inputElement.addEventListener("change", handleFiles, false); 
 
function handleFiles() { 
 
    var fileSelected = this.files[0]; /* now you can work with the file list */ 
 
    reader.readAsBinaryString(fileSelected); 
 
    downloadLink.href = window.URL.createObjectURL(fileSelected); 
 
}

<input type="file" id="input"> 
 
<a id="downloadLink" download>Download</a>