Cho phép các ứng dụng web đã cài đặt trở thành trình xử lý tệp

Đăng ký một ứng dụng làm trình xử lý tệp với hệ điều hành.

Giờ đây, khi các ứng dụng web có khả năng đọc và ghi tệp, phương pháp logic tiếp theo bước là cho phép nhà phát triển khai báo các ứng dụng web này dưới dạng trình xử lý tệp cho các tệp mà ứng dụng của họ có thể tạo và xử lý. API Xử lý tệp cho phép bạn thực hiện chính xác việc này. Sau khi đăng ký một tin nhắn ứng dụng chỉnh sửa dưới dạng một trình xử lý tệp. Sau khi cài đặt, bạn có thể nhấp chuột phải vào một tệp .txt trên macOS và chọn "Nhận thông tin" sau đó hướng dẫn hệ điều hành phải luôn mở tệp .txt bằng ứng dụng này dưới dạng mặc định.

Các trường hợp sử dụng được đề xuất cho API Xử lý tệp

Ví dụ về các trang web có thể sử dụng API này bao gồm:

  • Các ứng dụng Office như trình chỉnh sửa văn bản, ứng dụng bảng tính và trình tạo bản trình chiếu.
  • Trình chỉnh sửa đồ hoạ và công cụ vẽ.
  • Công cụ trình chỉnh sửa cấp trò chơi điện tử.

Cách sử dụng API Xử lý tệp

Cải tiến tăng dần

Mỗi API Xử lý tệp không thể được điền bằng polyfill. Chức năng mở tệp bằng web có thể đạt được thông qua hai cách khác:

  • Web Share Target API cho phép nhà phát triển chỉ định ứng dụng của họ làm mục tiêu chia sẻ để có thể mở tệp từ trang tính chia sẻ của hệ điều hành.
  • API Truy cập hệ thống tệp có thể được tích hợp với tính năng kéo và thả tệp, vì vậy nhà phát triển có thể xử lý các tệp bị thả trong ứng dụng đã mở.

Hỗ trợ trình duyệt

Hỗ trợ trình duyệt

  • Chrome: 102.
  • Cạnh: 102.
  • Firefox: không được hỗ trợ.
  • Safari: không được hỗ trợ.

Nguồn

Phát hiện tính năng

Để kiểm tra xem API Xử lý tệp có được hỗ trợ hay không, hãy sử dụng:

if ('launchQueue' in window && 'files' in LaunchParams.prototype) {
  // The File Handling API is supported.
}

Phần khai báo của API Xử lý tệp

Bước đầu tiên, các ứng dụng web cần mô tả rõ ràng trong tệp kê khai ứng dụng web họ có thể xử lý những loại tệp nào. API Xử lý tệp mở rộng tệp kê khai ứng dụng web bằng một có tên là "file_handlers" chấp nhận một mảng trình xử lý tệp. Một trình xử lý tệp là một đối tượng có các thuộc tính sau:

  • Thuộc tính "action" trỏ đến một URL trong phạm vi ứng dụng làm giá trị.
  • Một thuộc tính "accept" có một đối tượng thuộc loại MIME làm khoá và danh sách đuôi tệp làm khoá giá trị.
  • Một thuộc tính "icons" có một mảng ImageResource . Một số hệ điều hành cho phép liên kết loại tệp hiển thị một biểu tượng biểu tượng ứng dụng được liên kết mà là biểu tượng đặc biệt liên quan đến việc sử dụng loại tệp đó với ứng dụng.
  • Thuộc tính "launch_type" xác định xem có mở nhiều tệp trong một tệp hay không hoặc trong nhiều khách hàng. Giá trị mặc định là "single-client". Nếu người dùng mở nhiều tệp và nếu trình xử lý tệp đã được chú thích bằng "multiple-clients""launch_type" của dịch vụ này, nhiều lần khởi chạy ứng dụng sẽ diễn ra và mỗi lần khởi chạy, Mảng LaunchParams.files (xem bên dưới) sẽ chỉ có một phần tử.

Ví dụ dưới đây (chỉ cho thấy phần trích dẫn có liên quan của tệp kê khai ứng dụng web) sẽ giúp tệp này rõ ràng hơn:

{
  "file_handlers": [
    {
      "action": "/open-csv",
      "accept": {
        "text/csv": [".csv"]
      },
      "icons": [
        {
          "src": "csv-icon.png",
          "sizes": "256x256",
          "type": "image/png"
        }
      ],
      "launch_type": "single-client"
    },
    {
      "action": "/open-svg",
      "accept": {
        "image/svg+xml": ".svg"
      },
      "icons": [
        {
          "src": "svg-icon.png",
          "sizes": "256x256",
          "type": "image/png"
        }
      ],
      "launch_type": "single-client"
    },
    {
      "action": "/open-graf",
      "accept": {
        "application/vnd.grafr.graph": [".grafr", ".graf"],
        "application/vnd.alternative-graph-app.graph": ".graph"
      },
      "icons": [
        {
          "src": "graf-icon.png",
          "sizes": "256x256",
          "type": "image/png"
        }
      ],
      "launch_type": "multiple-clients"
    }
  ]
}

Nội dung này dành cho một ứng dụng giả định xử lý các tệp có giá trị được phân tách bằng dấu phẩy (.csv) tại /open-csv, tệp đồ hoạ vectơ có thể mở rộng (.svg) ở /open-svg và định dạng tệp Grafr đã được tạo với bất kỳ .grafr, .graf hoặc .graph nào là phần mở rộng tại /open-graf. Hai mục đầu tiên sẽ mở ra trong một ứng dụng, là ứng dụng cuối cùng trong nhiều ứng dụng nếu bạn xử lý nhiều tệp.

Phần thiết yếu của API Xử lý tệp

Bây giờ, ứng dụng đã khai báo những tệp mà ứng dụng có thể xử lý và về lý thuyết, ứng dụng cần xử lý những URL trong phạm vi. bắt buộc phải thực hiện tác vụ nào đó với tệp gửi đến trong thực tế. Đây là lúc launchQueue ra mắt bắt đầu chơi. Để truy cập vào các tệp đã chạy, trang web cần chỉ định người dùng cho window.launchQueue . Các đợt khởi chạy được đưa vào hàng đợi cho đến khi được người tiêu dùng chỉ định xử lý. Lệnh này sẽ được gọi chính xác một lần cho mỗi lần khởi chạy. Theo cách này, mọi lần khởi chạy đều được xử lý, bất kể thời điểm người tiêu dùng đã được chỉ định.

if ('launchQueue' in window && 'files' in LaunchParams.prototype) {
  launchQueue.setConsumer((launchParams) => {
    // Nothing to do when the queue is empty.
    if (!launchParams.files.length) {
      return;
    }
    for (const fileHandle of launchParams.files) {
      // Handle the file.
    }
  });
}

Hỗ trợ Công cụ cho nhà phát triển

Không có sự hỗ trợ nào cho Công cụ cho nhà phát triển tại thời điểm viết bài này, nhưng tôi đã gửi yêu cầu về tính năng để được hỗ trợ đã thêm.

Bản minh hoạ

Tôi đã thêm tính năng hỗ trợ xử lý tệp vào Excalidraw, một ứng dụng vẽ theo phong cách hoạt hình. Để thử nghiệm, trước tiên, bạn cần cài đặt Excalidraw. Sau đó, khi bạn tạo một tệp để lưu trữ ở một nơi nào đó hệ thống tệp của mình, bạn có thể mở tệp bằng cách nhấp đúp hoặc nhấp chuột phải rồi chọn "Rút bài" trong trình đơn theo bối cảnh. Bạn có thể xem cách triển khai trong nguồn .

Cửa sổ trình tìm kiếm của macOS có một tệp Excalidraw.
Nhấp đúp hoặc nhấp chuột phải vào một tệp trong trình khám phá tệp của hệ điều hành.
Trình đơn theo bối cảnh xuất hiện khi bạn nhấp chuột phải vào một tệp, trong đó mục Mở bằng... Excalidraw được làm nổi bật.
Excalidraw là trình xử lý tệp mặc định cho các tệp .excalidraw.

Bảo mật

Nhóm Chrome đã thiết kế và triển khai API Xử lý tệp theo các nguyên tắc cốt lõi được xác định trong Kiểm soát quyền truy cập vào các tính năng nền tảng web mạnh mẽ, bao gồm cả quyền kiểm soát của người dùng, tính minh bạch và tính công thái học.

Quyền, việc lưu trữ cố định quyền và cập nhật trình xử lý tệp

Để đảm bảo lòng tin của người dùng và sự an toàn của khi API Xử lý tệp mở tệp, lời nhắc cấp quyền sẽ xuất hiện trước khi PWA có thể xem tệp. Lời nhắc cấp quyền này sẽ hiển thị ngay sau khi người dùng chọn PWA mở tệp, để quyền được kết hợp chặt chẽ với thao tác mở tệp bằng PWA, giúp tệp đó trở nên dễ hiểu và phù hợp hơn.

Quyền này sẽ luôn xuất hiện cho đến khi người dùng nhấp vào để Cho phép hoặc Chặn xử lý tệp đối với trang web hoặc bỏ qua lời nhắc ba lần (sau đó Chromium sẽ cấm và chặn nội dung này quyền). Chế độ cài đặt đã chọn sẽ duy trì khi PWA đóng và mở lại.

Khi tệp kê khai cập nhật và thay đổi trong phần "file_handlers", quyền sẽ được đặt lại.

Có rất nhiều vectơ tấn công được mở ra bằng cách cho phép các trang web truy cập vào các tệp. Những vấn đề này được nêu trong bài viết về API Truy cập hệ thống tệp. Chiến lược phát hành đĩa đơn khả năng liên quan về bảo mật bổ sung mà API Xử lý tệp cung cấp cho Hệ thống tệp Access API là khả năng cấp quyền truy cập vào một số tệp nhất định thông qua các tính năng tích hợp sẵn trong hệ điều hành Giao diện người dùng, thay vì thông qua bộ chọn tệp mà một ứng dụng web hiển thị.

Người dùng vẫn có nguy cơ vô tình cấp cho ứng dụng web quyền truy cập vào tệp bằng cách đang mở. Tuy nhiên, mọi người thường hiểu rằng việc mở tệp sẽ cho phép ứng dụng, được mở để đọc và/hoặc thao tác với tệp đó. Do đó, lựa chọn rõ ràng của người dùng là mở một tệp trong ứng dụng đã cài đặt, chẳng hạn như qua lệnh "Mở bằng..." trình đơn theo bối cảnh, có thể được hiểu là tín hiệu tin cậy vào ứng dụng.

Thử thách trình xử lý mặc định

Trường hợp ngoại lệ là khi không có ứng dụng nào trên hệ thống lưu trữ cho một loại tệp nhất định. Trong trong trường hợp này, một số hệ điều hành máy chủ lưu trữ có thể tự động quảng bá trình xử lý mới đăng ký lên trình xử lý mặc định cho loại tệp đó mà không cần người dùng can thiệp. Điều này sẽ có nghĩa là nếu người dùng nhấp đúp vào một tệp thuộc loại đó, tệp sẽ tự động mở trong ứng dụng web. Trên các hệ điều hành lưu trữ đó, khi tác nhân người dùng xác định rằng không có trình xử lý mặc định cho loại tệp này, bạn có thể cần phải đưa ra lời nhắc cấp quyền rõ ràng để tránh vô tình gửi nội dung tệp lên ứng dụng web mà không có sự đồng ý của người dùng.

Quyền kiểm soát của người dùng

Thông số kỹ thuật nêu rõ rằng các trình duyệt không nên đăng ký mọi trang web có thể xử lý các tệp dưới dạng tệp trình xử lý. Thay vào đó, việc đăng ký xử lý tệp phải được kiểm soát sau quá trình cài đặt và không bao giờ xảy ra mà không có xác nhận rõ ràng của người dùng, đặc biệt nếu một trang web sẽ trở thành trình xử lý mặc định. Thay vào đó so với việc xâm nhập các tiện ích hiện có như .json mà người dùng có thể đã có trình xử lý mặc định đã đăng ký, các trang web nên xem xét tạo tiện ích của riêng chúng.

Sự minh bạch

Tất cả hệ điều hành đều cho phép người dùng thay đổi các liên kết tệp hiện có. Việc này nằm ngoài phạm vi của trình duyệt.

Phản hồi

Nhóm Chrome muốn biết ý kiến của bạn về trải nghiệm của bạn với API Xử lý tệp.

Cho chúng tôi biết về thiết kế API

Có điều gì về API không hoạt động như bạn mong đợi không? Hoặc có phương thức nào bị thiếu hoặc thuộc tính nào bạn cần để triển khai ý tưởng của mình? Có câu hỏi hoặc nhận xét về bảo mật mẫu?

  • Gửi vấn đề về thông số kỹ thuật trên kho lưu trữ GitHub tương ứng hoặc thêm ý kiến của bạn vào một kho lưu trữ hiện có vấn đề.

Báo cáo sự cố về triển khai

Bạn có phát hiện lỗi trong quá trình triển khai Chrome không? Hay cách triển khai có khác với thông số kỹ thuật không?

  • Báo cáo lỗi tại new.crbug.com. Hãy nhớ cung cấp càng nhiều thông tin chi tiết càng tốt có thể, hướng dẫn đơn giản để tái tạo và nhập UI>Browser>WebAppInstalls>FileHandling vào hộp Components (Thành phần). Glitch rất hữu ích để chia sẻ nhanh chóng và dễ dàng bản chép lời.

Hiện thông tin hỗ trợ về API này

Bạn có dự định sử dụng API Xử lý tệp không? Sự hỗ trợ công khai của bạn giúp nhóm Chrome ưu tiên các tính năng và cho các nhà cung cấp trình duyệt khác biết tầm quan trọng của việc hỗ trợ các tính năng đó.

Các đường liên kết hữu ích

Xác nhận

File handling API (API Xử lý tệp) do Eric Willigers chỉ định, Jay HarrisRaymes Khoury. Bài viết này được đánh giá bởi Joe Medley.