是否可以使用 javascript 从目录中读取文件

Is it possible to read files from a directory using javascript?

本文关键字：读取 文件 可以使 javascript 是否      更新时间：2023-09-26

我想读取一个目录并用这些文件的名称填充列表。

是否可以使用javascript完成此任务？

不，出于安全原因。

您可以通过调用 ActiveX 或 Flash 并让用户同意允许从这些插件访问文件系统来做到这一点，但是 - 请不要这样做。

编辑 10 年后：不仅请不要这样做，而且现在除了使用没有更新的旧设备之外 - 你不能用Flash/ActiveX做到这一点。

现在是 2022 年，世界内外发生了许多变化，你瞧，现在我们有了一个名为文件系统访问 API 的东西：

此 API 允许与用户本地设备上的文件或用户可访问的网络文件系统。此接口的核心功能包括读取文件、写入或保存文件以及访问目录结构。

它在 Chrome 86（2020 年 10 月发布）中可用。Safari 在 2021 年底发布的 15.2 版本中添加了支持。在撰写本文的那一刻，Firefox 不支持此功能（这是相关讨论）。

此外，安全考虑也没有消失：

此 API 打开了网络一直缺乏的潜在功能。尽管如此，在设计API时，安全性一直是最受关注的问题，并且除非用户特别允许它。

<小时 />

这部分不再相关（感谢@gignu在评论中提到这一点），由于历史原因留在这里。

我想使用webkitdirectory属性可能会得到最接近的：

.HTML 

<input type="file" id="file_input" webkitdirectory="" directory="" />
<div id="list_of_files"></div>
...

.JS

var $list = $('#list_of_files');
$('#file_input').change(function(event) {
  var listOfFiles = event.target.files;
  for (var i = 0, l = listOfFiles.length; i < l; ++i) {
     $list.append($('<p>'+ listOfFiles[i].name +'</p>'));
  }
});

。如图所示。但它仅适用于 Chrome（并且建议使用mozdirectory属性没有帮助）。

您可以尝试使用FileReader对象，但浏览器对它的支持很差。

在谷歌浏览器中，您可以提示客户端选择一个目录，然后使用它列出该目录及其子目录中包含的文件：

<input type="file" webkitdirectory onchange="listContents(this.files)">

listContents将是您的实现。

我不知道

你是否在做安全研究等。所以除了说"你不应该这样做"之外，这个问题的实际答案是，你实际上可以通过利用编写不佳的JS代码来读取文件，这就是为什么你应该编码。防守。

然后是这个：http://www.html5rocks.com/en/tutorials/file/dndfiles/

是的，

具体取决于您拥有的浏览器。

尽管这不是一种常见的做法，但您可以使用某些浏览器，例如Chrome（使用webkitRequestFileSystem支持的requestFileSystem）或在Internet Explorer中使用文件系统对象。

相关文章：