访问给定文件夹中的所有文件（文件系统访问 API）

Question

我可以使用文件系统访问 API ( https://web.dev/file-system-access/ ) 在网站内创建类似文件资源管理器的东西 (react)。

我计划制作一个简单的在线文件资源管理器，让您浏览打开一个文件夹，然后让您浏览该文件夹、播放视频和 MP3。

（我知道几年前这是不可能的，因为 js 不可能访问本地存储中的任何内容，我只是想知道是否有任何更改。如果文件系统访问 API 不是可行的方法，您能否建议一些更好的方法来从文件夹中读取批量本地文件。）

Answer 1

为了将来参考，我正在发布我的作品；https://github.com/akshayknz/filesystem-access-api/blob/main/file.html（一个 html 页面，显示所选文件夹中的所有图像。）

注意：API 仅在安全上下文中工作（即它在 https:// 和 file:/// 中工作）

[fileHandle] = await window.showOpenFilePicker();
const file = await fileHandle.getFile();
const contents = await file.text();

或者

const dirHandle = await window.showDirectoryPicker();
const fileHandle = await dirHandle.getFileHandle(entry.name, {});
const file = await fileHandle.getFile();