问题标签 [native-file-system-api-js]

免责声明，自我回答的帖子，希望能节省其他人的时间。

设置：

我一直在使用 chrome 的文件系统 API 实现[1] [2] [3]。

这需要启用标志chrome://flags/#native-file-system-api。

对于初学者，我想递归读取目录并获取文件列表。这很简单：

我还实现了一个非递归的 while-loop-queue 版本。最后，我实现了一个节点fs.readdir版本。所有 3 种解决方案都适用于小目录。

问题：

但后来我尝试在铬源代码的一些子目录（'base'、'components'和'chrome'）上运行它；3 个子目录总共包含约 63,000 个文件。虽然节点实现运行良好（令人惊讶的是，它在运行之间使用了缓存结果，导致在第一次运行之后立即运行），两种浏览器实现都挂起。

尝试调试：

有时，他们会返回完整的 63k 文件并按'COMPLETLEY DONE'预期打印。但大多数情况下（90% 的时间）他们会在挂起之前读取 10k-40k 文件。

我深入挖掘了悬挂，显然这for await条线是悬挂的。所以我window.handle = handle在 for 循环之前添加了这一行；当函数挂起时，我直接在浏览器控制台中运行了 for 循环，它工作正常！所以现在我被困住了。我似乎有随机挂起的工作代码。

我们正在创建一个离线播放器，以最大限度地减少使用 FileSystem API 的缓冲。我可以打开一个目录并从那里获取视频，但我仍然无法获取路径。我正在寻找访问用户选择的目录的路径，但我不知道如何。文档不清楚

注意：关于如何使用 Javascript 在用户设备上打开文件夹已经存在一些问题。但是，这些问题是在Native File System API之前提出的。

1. 如何使用 javascript 从 Web 浏览器打开 Window File Explorer
2. 从链接打开本地文件夹
3. 从网页中打开 finder/explorer 中的文件夹？

我的问题非常具体，有没有办法使用新的“本机文件系统 API”在默认文件探索中打开文件夹（即 Windows 中的 Windows 资源管理器和 Mac 中的 Finder）。

我正在尝试读取 XML 文件的内容。可能这是基本的 JS 东西，但我似乎无法让它工作。

我正在使用 Chrome 的实验性 Native File System API 来读取文件夹中的文件夹：

然后，稍后在代码中，我从主目录输入其中一个文件夹并尝试读取其中的文件。文件系统结构如下：

代码的第二部分如下所示：

我相信问题var xmlFile = await subdirHandle.getFile('subject.xml');出在文件读取上。如果我直接从 Input 加载文件并使用FileReader()，我能够获取内容并解析它，但是使用“目录”方法我得到 null（对于评估的文档），就像这样Uncaught (in promise) TypeError: Cannot read property 'childNodes' of null

在这里编辑是我在控制台中获得的 xmlFile 变量。我只需要从中获取内容（文本格式的 XML）

我有自己的自定义系统，需要创建txt文件以便在有新订单时打印现金收据。我需要将这些文件本地保存到计算机的特定位置，但是有没有办法将文件保存到该位置而不提示用户选择文件位置？如果您创建自己的FileSystemFileHandle类然后将其作为句柄传递，是否有可能？

我正在使用最新版本的 Edge（Canary 版本 86.0.615.0），我可以获得新的本机文件系统 API showOpenFilePicker 让我访问文件，但我找不到对 directoryHandle 函数的引用，包括 removeEntry 函数，如果用户选择删除文件。我错过了一个特殊的标志吗？我有一个 Origin-Tracker 代码，我还为 Native File System API 设置了实验标志。

我正在尝试使用 FileSystem API 使用 FileSystem API 将 SPA 上上传的文件写入本地沙盒文件系统。

文件是用 drop acion 上传的，我可以在回调中获取File对象数组。从File我可以得到ReadableStream调用stream方法（是的，它只返回可读的流）。

考虑到上传的文件可能足够大，我会选择流而不是完全加载到 blob 中，然后写入 FileSystem api。

因此，按照文档的步骤是：

1. 通过异步调用获取FileSystem（DOMFileSystem） 。webkitRequestFileSystem
2. root获取作为 FileSystemDirectoryEntry的道具
3. 通过getFile（带有标志create:true）创建一个返回（异步）a的文件FileSystemFileEntry

现在从 FileEntry 我可以得到一个 FileWriter 使用createWriter，但它已经过时（在 MDN 中），并且无论如何它是一个 FileWriter 而我希望获得一个WritableStream而不是为了使用pipeTo上传的文件 Handler->ReadableStream。

所以，我看到在控制台FileSystemFileHandler中定义了类（接口），但我不明白如何从FileSystemFileEntry. 如果我能获得一个，FileSystemFileHandler我可以调用createWritable来获得一个FileSystemWritableFileStream我可以用 ReadStream 进行“管道”的操作。

谁能澄清这个烂摊子？

参考： https://web.dev/file-system-access/ https://wig.github.io/file-system-access/#filesystemhandle https://developer.mozilla.org/en-US/docs/ Web/API/文件系统文件条目

我正在尝试读取已在本地计算机中创建的文本文件（log.txt），并希望使用文件系统 api 方法将文本附加到来自 webworker 的同一文件，但无法这样做，也无法获得任何错误即使尝试使用 react app 有线应用程序通过 postMessage() 方法将错误发送到主线程，也会记录日志

//worker.js

众所周知<input/>，出于安全原因，浏览器不支持在页面重新加载时重新填充文件路径。但最近chrome 86发布了File System Access API，它简化并允许用户读取文件的上下文。如果我们将它与File System API配对（不要混淆它们），在window.requestFileSystem的帮助下，我们可以在加载之间持久化文件，这部分解决了这个记住和重新填充文件输入堆栈溢出问题。

我想知道我们是否可以在选项卡重新加载时使用 FileSystemFileHandle 重新填充文件。通过 requestFileSystem 执行此操作会限制我们的文件大小，因为我们会在每个选择上复制文件。具体来说，我希望能够在重新加载页面后上传和读取用户选择的文件，而无需将其保存到 localFileSystem。

我还将这个问题发布到github issues。

我正在尝试使用文件系统访问 API 附带的函数。

例如，当网站使用文件系统访问 API 时，如下所示。

可以用 JavaScript 挂钩 Web API 吗？我的意思是当网站使用这个 API 时如何停止它的进程？