chrome.fileBrowserHandler

refresh date: 2026-09-25 robots: noindex

Mô tả

Quyền

Phạm vi cung cấp

Trình duyệt tệp ChromeOS sẽ xuất hiện khi người dùng nhấn tổ hợp phím Alt+Shift+M hoặc kết nối thiết bị lưu trữ ngoài, chẳng hạn như thẻ SD, khoá USB, ổ đĩa ngoài hoặc máy ảnh kỹ thuật số. Ngoài việc hiển thị các tệp trên thiết bị bên ngoài, trình duyệt tệp cũng có thể hiển thị các tệp mà người dùng đã lưu vào hệ thống trước đó.

Khi người dùng chọn một hoặc nhiều tệp, trình duyệt tệp sẽ thêm các nút đại diện cho trình xử lý hợp lệ của những tệp đó. Ví dụ: trong ảnh chụp màn hình sau, việc chọn một tệp có hậu tố ".png" sẽ dẫn đến nút "Lưu vào Thư viện" mà người dùng có thể nhấp vào.

Tệp kê khai

Bạn phải khai báo quyền "fileBrowserHandler" trong tệp kê khai tiện ích và phải sử dụng trường "file_browser_handlers" để đăng ký tiện ích làm trình xử lý của ít nhất một loại tệp. Bạn cũng nên cung cấp một biểu tượng 16x16 để hiển thị trên nút. Ví dụ:

{
  "name": "My extension",
  ...
  "file_browser_handlers": [
    {
      "id": "upload",
      "default_title": "Save to Gallery", // What the button will display
      "file_filters": [
        "filesystem:*.jpg",  // To match all files, use "filesystem:*.*"
        "filesystem:*.jpeg",
        "filesystem:*.png"
      ]
    }
  ],
  "permissions" : [
    "fileBrowserHandler"
  ],
  "icons": {
    "16": "icon16.png",
    "48": "icon48.png",
    "128": "icon128.png"
  },
  ...
}

Triển khai trình xử lý trình duyệt tệp

Để sử dụng API này, bạn phải triển khai một hàm xử lý sự kiện onExecute của chrome.fileBrowserHandler. Hàm của bạn sẽ được gọi bất cứ khi nào người dùng nhấp vào nút đại diện cho trình xử lý trình duyệt tệp. Trong hàm của bạn, hãy dùng File System API để truy cập vào nội dung tệp. Dưới đây là ví dụ:

chrome.fileBrowserHandler.onExecute.addListener(async (id, details) => {
  if (id !== 'upload') {
    return;  // check if you have multiple file_browser_handlers
  }

  for (const entry of detail.entries) {
    // the FileSystemFileEntry doesn't have a Promise API, wrap in one
    const file = await new Promise((resolve, reject) => {
      entry.file(resolve, reject);
    });
    const buffer = await file.arrayBuffer();
    // do something with buffer
  }
});

Trình xử lý sự kiện của bạn được truyền hai đối số:

id

Giá trị "id" trong tệp kê khai. Nếu tiện ích của bạn triển khai nhiều trình xử lý, bạn có thể kiểm tra giá trị nhận dạng để xem trình xử lý nào đã được kích hoạt.

chi tiết

Một đối tượng mô tả sự kiện. Bạn có thể lấy (các) tệp mà người dùng đã chọn trong trường entries của đối tượng này. Đây là một mảng gồm các đối tượng FileSystemFileEntry.

chrome.fileBrowserHandler.onExecute.addListener(
  callback: function,
)