FileSystemObserver

安全上下文: 此项功能仅在一些支持的浏览器的安全上下文（HTTPS）中可用。

实验性: 这是一项实验性技术
在将其用于生产之前，请仔细检查浏览器兼容性表格。

非标准: 该特性尚未标准化。我们不建议在生产环境中使用非标准特性，因为它们在浏览器中的支持有限，且可能发生变化或被移除。不过，在没有标准选项的特定情况下，它们可以作为合适的替代方案。

文件系统 API 的 FileSystemObserver 接口提供了一种可以观察用户可观察的文件系统和源私有文件系统（OPFS）的变化的机制。这意味着 Web 应用程序无需轮询文件系统来查找文件或文件夹结构的更改，从而避免耗时和浪费资源。

构造函数

FileSystemObserver()

创建一个新的 FileSystemObserver 对象实例。

实例方法

disconnect()

停止观察文件系统。

observe()

开始观察给定文件或目录的变化。

示例

备注： 有关完整的工作示例，请查看文件系统观察器示例（源代码）。

初始化 FileSystemObserver

在开始观察文件或目录更改之前，你需要初始化一个 FileSystemObserver 来处理这些观察结果。这可以通过 FileSystemObserver() 构造函数来完成，该构造函数接受一个回调函数作为参数：

js
const observer = new FileSystemObserver(callback);

你可以指定回调函数主体，以任何你想要的方式返回和处理文件更改观察结果：

js
const callback = (records, observer) => { for (const record of records) { console.log("检测到的变化：", record); const reportContent = `观察到的变更为 ${record.changedHandle.kind} ${record.changedHandle.name}。类型：${record.type}。`; sendReport(reportContent); // 某种用户定义的报告函数 } observer.disconnect(); };

观察文件或目录

一旦 FileSystemObserver 实例可用，你就可以通过调用 FileSystemObserver.observe() 方法开始观察文件系统条目的变化。

你可以通过向 observe() 传入 FileSystemFileHandle 或 FileSystemDirectoryHandle 来观察用户可观察文件系统或源私有文件系统（OPFS）中的文件或目录。例如，当要求用户使用 Window.showSaveFilePicker() 或 Window.showDirectoryPicker() 选择文件或目录时，可以返回这些对象的实例：

js
// 观察文件 async function observeFile() { const fileHandle = await window.showSaveFilePicker(); await observer.observe(fileHandle); } // 观察目录 async function observeDirectory() { const directoryHandle = await window.showDirectoryPicker(); await observer.observe(directoryHandle); }

你还可以通过将 FileSystemSyncAccessHandle 传递给 observe() 来观察 OPFS 的变化：

js
// 观察 OPFS 文件系统条目 async function observeOPFSFile() { const root = await navigator.storage.getDirectory(); const draftHandle = await root.getFileHandle("draft.txt", { create: true }); const syncHandle = await draftHandle.createSyncAccessHandle(); await observer.observe(syncHandle); }

停止观察文件系统

当你想要停止观察文件系统条目的变化时，可以调用 FileSystemObserver.disconnect()：

js
observer.disconnect();

规范

目前不属于任何规范。相关规范 PR 请参阅 https://github.com/whatwg/fs/pull/165。

浏览器兼容性

参见