文件操作，例如在没有服务器的情况下使用 Javascript 读取/写入本地文件答案

【问题标题】：File manipulations such as Read/Write local files using Javascript without server文件操作，例如在没有服务器的情况下使用 Javascript 读取/写入本地文件
【发布时间】：2017-05-10 06:40:46
【问题描述】：

我只是在尝试使用 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 等服务器脚本语言进行文件操作。

提前致谢。

【问题讨论】：

“本地文件”是指安装浏览器的机器上的文件吗？或者，你的意思是服务器机器上的文件？
是的，我的意思是安装浏览器的机器上的文件。 @shaochuancs。当然，上面给出的代码适用于服务器端。但是我们可以在本地做吗？
但是在您的代码中，您发送GET Ajax 请求以读取服务器端的文件。
是的，但是您的意思是将代码编写为POST Ajax 请求吗？ @shaochuancs .
我已经尝试过 FileAPI（上面已经提到过），但我只能从本地文件中读取。如果您熟悉任何写入本地文件的程序，请在此处编写您的代码。 @shaochuancs。

标签： javascript html fileapi local-files

【解决方案1】：

在您的代码中，它不是从本地文件 (test.txt) 读取，而是向服务器发送 Ajax GET 请求并在服务器端读取文件。

要读取本地文件（存储在安装浏览器的机器上的文件），您需要使用 FileAPI，当前代码中没有使用。

要将文件写入本地，无法直接使用 JavaScript 写入。否则，这将是一个巨大的安全漏洞。但是，您可以从 File 对象生成一个 URL，并将该 URL 用作 <a> 标签的 href 属性，以便用户可以手动下载和“写入本地”。

这里是一个用于读取和“写入”本地文件的代码 sn-p：

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>

【讨论】：

感谢@shaochuancs 先生的宝贵努力。