FileSystemObserver

Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

Experimental: This is an experimental technology
Check the Browser compatibility table carefully before using this in production.

Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

Giao diện FileSystemObserver của File System API cung cấp cơ chế để theo dõi các thay đổi trong hệ thống tệp người dùng quan sát được và Hệ thống tệp riêng tư theo nguồn gốc (OPFS). Điều này có nghĩa là các ứng dụng web không cần phải liên tục truy vấn hệ thống tệp để tìm thay đổi trong các tệp hoặc cấu trúc thư mục, điều này có thể tốn thời gian và lãng phí.

Hàm khởi tạo

FileSystemObserver() Experimental Non-standard

Tạo một phiên bản đối tượng FileSystemObserver mới.

Phương thức phiên bản

disconnect() Experimental Non-standard

Dừng quan sát hệ thống tệp.

observe() Experimental Non-standard

Bắt đầu quan sát các thay đổi đối với tệp hoặc thư mục được cho.

Ví dụ

Note: Để xem ví dụ hoạt động đầy đủ, hãy xem File System Observer Demo (mã nguồn).

Khởi tạo FileSystemObserver

Trước khi có thể bắt đầu quan sát các thay đổi tệp hoặc thư mục, bạn cần khởi tạo FileSystemObserver để xử lý các quan sát. Điều này được thực hiện bằng cách sử dụng hàm khởi tạo FileSystemObserver(), nhận một hàm callback làm tham số:

js
const observer = new FileSystemObserver(callback);

Nội dung hàm callback có thể được chỉ định để trả về và xử lý các quan sát thay đổi tệp theo bất kỳ cách nào bạn muốn:

js
const callback = (records, observer) => {
  for (const record of records) {
    console.log("Change detected:", record);
    const reportContent = `Change observed to ${record.changedHandle.kind} ${record.changedHandle.name}. Type: ${record.type}.`;
    sendReport(reportContent); // Some kind of user-defined reporting function
  }

  observer.disconnect();
};

Quan sát tệp hoặc thư mục

Sau khi có phiên bản FileSystemObserver, bạn có thể bắt đầu quan sát các thay đổi đối với một mục nhập hệ thống tệp bằng cách gọi phương thức FileSystemObserver.observe().

Bạn có thể quan sát tệp hoặc thư mục trong hệ thống tệp người dùng quan sát được hoặc Hệ thống tệp riêng tư theo nguồn gốc (OPFS) bằng cách truyền FileSystemFileHandle hoặc FileSystemDirectoryHandle vào observe(). Các phiên bản của các đối tượng này có thể được trả về, ví dụ, khi yêu cầu người dùng chọn tệp hoặc thư mục bằng Window.showSaveFilePicker() hoặc Window.showDirectoryPicker():

js
// Observe a file
async function observeFile() {
  const fileHandle = await window.showSaveFilePicker();

  await observer.observe(fileHandle);
}

// Observe a directory
async function observeDirectory() {
  const directoryHandle = await window.showDirectoryPicker();

  await observer.observe(directoryHandle);
}

Bạn cũng có thể quan sát các thay đổi đối với OPFS bằng cách truyền FileSystemSyncAccessHandle vào observe():

js
// Observe an OPFS file system entry
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);
}

Dừng quan sát hệ thống tệp

Khi bạn muốn dừng quan sát các thay đổi đối với mục nhập hệ thống tệp, bạn có thể gọi FileSystemObserver.disconnect():

js
observer.disconnect();

Thông số kỹ thuật

Hiện chưa là một phần của bất kỳ thông số kỹ thuật nào. Xem https://github.com/whatwg/fs/pull/165 để biết PR thông số kỹ thuật liên quan.

Tương thích trình duyệt

Xem thêm