用Javascript从本地目录读取文件答案

【问题标题】：Read file from local directory in Javascript用Javascript从本地目录读取文件
【发布时间】：2013-11-08 01:31:04
【问题描述】：

我需要使用 Javascript（或使用 JQuery，没关系）从计算机硬盘中的特定路径读取文件。我一直在谷歌搜索，但我发现的东西并没有真正的帮助。我最接近的是：

  function readSingleFile(evt) {
    //Retrieve the first (and only!) File from the FileList object
    var f = evt.target.files[0]; 

    if (f) {
      var r = new FileReader();
      r.onload = function(e) { 
          var contents = e.target.result;
        alert( "Got the file.\n" 
              +"name: " + f.name + "\n"
              +"type: " + f.type + "\n"
              +"size: " + f.size + " bytes \n"
              + "starts with: " + contents.substr(1, contents.indexOf("\n"))
        );  
      }
      r.readAsText(f);
    } else { 
      alert("Failed to load file");
    }
  }

  document.getElementById('fileinput').addEventListener('change', readSingleFile, false);

它允许使用文件选择器选择文件，然后显示文件的内容。我需要编写一个程序来读取您明确指定位置的文件，例如 c:\files\test.txt，并打印 test.txt 文件的内容。

我在 Google 上搜索了很多次，但都没有成功，欢迎提供任何帮助。

【问题讨论】：

为什么你认为浏览器应该允许你访问我的硬盘文件？！
看来您正在操作附加到表单的文件对象，JS 无法在文件系统上抓取平面文件，您需要节点。
我只需要一个很小的应用程序来读取一些文件和显示数据，所以我想把它变成网络，但没有网络服务器以避免复杂化，这就是我考虑使用 Javascript 的原因。所以这是不可能的？
访问该文件的唯一方法是让用户手动选择它。
感谢您的快速响应，我将不得不另找一种语言来完成这项任务。

标签： javascript jquery

【解决方案1】：

如果我错了，请有人纠正我，但据我所知，由于安全问题，这在 JavaScript 中是不可能的。

如果是这样，网页可能会在未经您同意或您不知情的情况下抓取您文件系统上的任何文件。这是一个重大的安全问题，所以我认为这是不可能的。

必须为用户提供在知情的情况下从其文件系统中选择文件的选项。

【讨论】：

感谢您的回答，看来这是正确的回答，我会用另一种语言做应用程序以避免出现问题。
好吧，但它只能在 chrome 中使用。谷歌 webkit 目录
可以使用File System Access API从客户端JavaScript中的目录读取文件。

【解决方案2】：

出于安全原因，这是不可能的，也不建议这样做。

如果这只是在您的个人计算机上使用或出于测试原因，您可以为您的浏览器添加一个选项以允许文件访问，但如果您正在浏览其他网站，这显然是一个安全问题。

假设你使用的是 Chrome，你可以为 chrome 创建一个快捷方式并附加

--allow-file-access-from-files

到目标字段。

然后您必须启动该快捷方式，并从该浏览器实例打开 html。

理想情况下，您应该托管文件服务器端，或者有一个文件选择选项。

【讨论】：

感谢回答，好像比我想象的要复杂，所以我打算用另一种语言来做这个小程序。

【解决方案3】：

无法访问用户文件系统。

但是，使用 FileSystem API，您可以获得一个临时或持久的私有文件系统，您可以在其中为您的应用程序存储内容（例如缓存的图像）。然后，您可以将此 API 与 File API 结合使用，以允许用户将文件从用户文件拖放到您的应用程序中。

根据您的应用程序，这可能会或可能不会令人满意。

文件系统 API 教程： http://www.html5rocks.com/en/tutorials/file/filesystem/

文件 API 教程： http://www.sitepoint.com/html5-file-drag-and-drop/

【讨论】：