html5 选择文件目录,从JavaScript / HTML5中的目录加载所有文件(Load all files from a directory in JavaScript/HTML5)...-CSDN博客

从JavaScript / HTML5中的目录加载所有文件(Load all files from a directory in JavaScript/HTML5)

我希望我的网站访问者选择包含文件的目录，然后在JavaScript中处理它们。我知道如何让他们选择大量的单个文件而不是整个目录，这在这里非常重要。

如何做呢？文件的处理必须在JavaScript中完成。它应该适用于最新的Firefox，Chrome和IE，如果可能的话。

我不能告诉他们压缩文件，然后选择zip，因为它可以处理几GB的文件。

也许Flash可以提供帮助？

I want visitors of my websites to select a directory with files and then process them in JavaScript. I know how to let them select lots of individual files but not whole directories, which is pretty important here.

How can it be done? The processing of the files must be done in JavaScript. It should work in newest Firefox, Chrome and, if possible, IE.

I cannot tell them to zip the files and then select the zip since it can be a few GB of files to process.

Maybe Flash could help?

原文：https://stackoverflow.com/questions/26005480

更新时间：2019-12-28 13:43

最满意答案

发现自己正在寻找一个例子，但我还没有探索它的来源。适用于Windows 8.1上的Chrome。希望这有助于某人。

它用：

Found that looking for an example myself, but I did not explore the source yet. Works on Chrome on Windows 8.1. Hope this helps someone.

It uses:

\< input type="file" id="file_input" webkitdirectory="" directory="">

相关问答

由于安全原因，我认为您不允许使用javascript触发下载。请参阅：通过js或查询强制下载 I don't think you're allowed to trigger a download using javascript due to security reasons. See: Force download through js or query

HTML5 Audio对象您不需要打扰元素。 HTML 5可让您直接访问Audio对象： var snd = new Audio("file.wav"); // buffers automatically when created

snd.play();

在当前版本的规范中不支持混合。要多次播放相同的声音，请创建多个Audio对象实例。在对象完成播放之后，您还可以在对象上设置snd.currentTime=0 。由于JS构造函数不支持回退元素，所以应该使用

...

嗯，我发现这个问题看起来和你的一样，就读文件而言。至于解析为什么不使用像MySQL这样的数据库存储你的数据呢？这样，您就可以快速添加和查询数据。 Hm, I found this question which appears to be similar to yours as far as reading a file goes. As for parsing though why not use a database such as MySQL to store your data? Thi

...

在同一个网站上，它讨论了创建一个DirectoryReader以获取文件的内容，这听起来像你想要做的。 http://www.html5rocks.com/en/tutorials/file/filesystem/#toc-dir-reading On that same website it talks about creating a DirectoryReader to get the contents of a file, which is what it sounds like you

...

所以我理解，你有两个音频文件，你想在客户端上一起渲染。 Web音频API可以非常轻松地在JavaScript中完成此操作。一个好的起点是http://www.html5rocks.com/en/tutorials/webaudio/intro/ 一个示例脚本将是 var context = new(window.AudioContext || window.webkitAudioContext) // Create an audio context

// Create an XML HTTP

...

发现自己正在寻找一个例子，但我还没有探索它的来源。适用于Windows 8.1上的Chrome。希望这有助于某人。用于本地文件和目录的HTML5照片浏览器它用： \ Found that looking for an example myself, but I did not explore the source yet. Works on Chrome

...

由于安全限制，在客户端计算机上运行的Javascript无法访问本地磁盘文件系统。否则，人们可以使用Javascript以隐藏的形式上传文件。如果您想访问客户端的磁盘文件系统，请在不同的角落寻找解决方案：从您的网页提供的嵌入式客户端应用程序，如Applet，Webstart，Silverlight或类似的东西。如果您想访问服务器的磁盘文件系统，那么使用服务器端编程语言(如Java，PHP等)在服务器端角寻找解决方案，无论您的Web服务器当前正在使用/支持什么。 Javascript whic

...

我会使用Felix Kling的JSONP方法。将数据文件包装在回调函数中： (function(data) {

// Do things with your data object here

})(

// Put your data object here as the argument to the callback

);

当您将此脚本文件包含在标记中时，将自动执行回调函数。 I would use Felix Kling's approach with JSONP. Wrap y

...

是。您可以为存储桶启用CORS，以便可以通过XMLHttpRequest加载对象。 http://aws.typepad.com/aws/2012/08/amazon-s3-cross-origin-resource-sharing.html http://docs.aws.amazon.com/AmazonS3/latest/dev/cors.html 特别是在使用PhoneGap / Cordova时，您可以通过在应用程序中将域列入白名单来绕过在服务器上启用CORS： http://docs

...