Đăng ký trình xử lý giao thức URL cho PWA

Cho phép các PWA đã cài đặt xử lý những đường liên kết sử dụng một giao thức cụ thể để mang lại trải nghiệm tích hợp hơn.

Thông tin cơ bản về lược đồ (còn gọi là giao thức)

Giá trị nhận dạng tài nguyên thống nhất (URI) là một chuỗi ký tự ngắn gọn giúp xác định một tài nguyên trừu tượng hoặc tài nguyên vật lý. Mỗi URI bắt đầu bằng một tên lược đồ đề cập đến một quy cách để chỉ định giá trị nhận dạng trong lược đồ đó. Do đó, cú pháp URI là một hệ thống đặt tên liên kết và có thể mở rộng, trong đó quy cách của mỗi lược đồ có thể hạn chế thêm cú pháp và ngữ nghĩa của các giá trị nhận dạng bằng lược đồ đó. Lược đồ còn được gọi là giao thức. Bạn có thể xem một số ví dụ về lược đồ bên dưới.

tel:+1-816-555-1212
mailto:Jane.Doe@example.com
news:comp.infosystems.www.servers.unix
https://web.dev/

Thuật ngữ Bộ định vị tài nguyên đồng nhất (URL) đề cập đến tập hợp con của URI. Ngoài việc xác định một tài nguyên, URL còn cung cấp phương tiện để xác định vị trí của tài nguyên bằng cách mô tả cơ chế truy cập chính của tài nguyên đó (ví dụ: vị trí mạng của tài nguyên).

Thông tin cơ bản về phương thức registerProtocolHandler()

Phương thức secure-content-only Navigator registerProtocolHandler() cho phép các trang web đăng ký khả năng mở hoặc xử lý các lược đồ URL cụ thể. Do đó, các trang web cần gọi phương thức này như sau: navigator.registerProtocolHandler(scheme, url). Hai thông số này được xác định như sau:

  • scheme: Một chuỗi chứa giao thức mà trang web muốn xử lý.
  • url: Một chuỗi chứa URL của trình xử lý. URL này phải bao gồm %s dưới dạng một trình giữ chỗ sẽ được thay thế bằng URL đã thoát cần xử lý.

Lược đồ phải là một trong các lược đồ trong danh sách an toàn (ví dụ: mailto, bitcoin hoặc magnet) hoặc bắt đầu bằng web+, theo sau là ít nhất một hoặc nhiều chữ cái ASCII viết thường sau tiền tố web+, chẳng hạn như web+coffee.

Để minh hoạ rõ hơn, sau đây là một ví dụ cụ thể về quy trình:

  1. Người dùng truy cập vào một trang web tại https://coffeeshop.example.com/ và trang web đó thực hiện lệnh gọi sau: navigator.registerProtocolHandler('web+coffee', 'coffee?type=%s').
  2. Sau đó, khi truy cập vào https://randomsite.example.com/, người dùng nhấp vào một đường liên kết, chẳng hạn như <a href="web+coffee:latte-macchiato">All about latte macchiato</a>.
  3. Điều này khiến trình duyệt chuyển đến URL sau: https://coffeeshop.example.com/coffee?type=web%2Bcoffee%3A%2F%2Flatte-macchiato. Chuỗi tìm kiếm được giải mã URL, sau đó đọc ?type=web+coffee://latte-macchiato.

Giới thiệu về việc xử lý giao thức

Cơ chế đăng ký trình xử lý giao thức URL cho PWA hiện tại là cung cấp tính năng đăng ký trình xử lý giao thức trong quá trình cài đặt PWA thông qua tệp kê khai của PWA. Sau khi đăng ký một PWA làm trình xử lý giao thức, khi người dùng nhấp vào một siêu liên kết có một lược đồ cụ thể như mailto, bitcoin hoặc web+music từ trình duyệt hoặc ứng dụng dành riêng cho nền tảng, PWA đã đăng ký sẽ mở và nhận URL. Điều quan trọng cần lưu ý là cả quy trình đăng ký dựa trên tệp kê khai được đề xuất và registerProtocolHandler() truyền thống đều đóng vai trò rất giống nhau trên thực tế, đồng thời vẫn cho phép khả năng mang lại trải nghiệm bổ sung cho người dùng:

  • Các điểm tương đồng bao gồm các yêu cầu về danh sách lược đồ được phép đăng ký, tên và định dạng của các tham số, v.v.
  • Sự khác biệt trong quá trình đăng ký dựa trên tệp kê khai là không đáng kể, nhưng có thể hữu ích để nâng cao trải nghiệm cho người dùng PWA. Ví dụ: quy trình đăng ký PWA dựa trên tệp kê khai có thể không yêu cầu người dùng thực hiện thêm thao tác nào ngoài việc người dùng bắt đầu cài đặt PWA.

Trường hợp sử dụng

  • Trong một PWA xử lý văn bản, người dùng trong một tài liệu sẽ gặp phải một đường liên kết đến một bản trình bày như web+presentations://deck2378465. Khi người dùng nhấp vào đường liên kết, PWA trình bày sẽ tự động mở trong phạm vi chính xác và hiển thị bộ trang trình bày.
  • Trong một ứng dụng trò chuyện dành riêng cho nền tảng, người dùng trong tin nhắn trò chuyện sẽ nhận được một đường liên kết đến URL magnet. Sau khi bạn nhấp vào đường liên kết, một PWA torrent đã cài đặt sẽ khởi chạy và bắt đầu tải xuống.
  • Người dùng đã cài đặt một PWA phát nhạc trực tuyến. Khi một người bạn chia sẻ đường liên kết đến một bài hát như web+music://songid=1234&time=0:13 và người dùng nhấp vào đường liên kết đó, PWA phát nhạc trực tuyến sẽ tự động khởi chạy trong một cửa sổ độc lập.

Cách sử dụng tính năng đăng ký trình xử lý giao thức URL cho PWA

API để đăng ký trình xử lý giao thức URL được mô hình hoá chặt chẽ trên navigator.registerProtocolHandler(). Lần này, thông tin được truyền một cách khai báo thông qua tệp kê khai ứng dụng web trong một thuộc tính mới có tên là "protocol_handlers". Thuộc tính này nhận một mảng các đối tượng có 2 khoá bắt buộc là "protocol""url". Đoạn mã dưới đây cho thấy cách đăng ký web+teaweb+coffee. Các giá trị là chuỗi chứa URL của trình xử lý có phần giữ chỗ %s bắt buộc cho URL đã thoát.

{
  "protocol_handlers": [
    {
      "protocol": "web+tea",
      "url": "/tea?type=%s"
    },
    {
      "protocol": "web+coffee",
      "url": "/coffee?type=%s"
    }
  ]
}

Nhiều ứng dụng đăng ký cùng một giao thức

Nếu nhiều ứng dụng tự đăng ký làm trình xử lý cho cùng một lược đồ, ví dụ: giao thức mailto, hệ điều hành sẽ cho người dùng thấy một bộ chọn và cho phép họ quyết định sử dụng trình xử lý đã đăng ký nào.

Cùng một ứng dụng đăng ký nhiều giao thức

Cùng một ứng dụng có thể tự đăng ký cho nhiều giao thức, như bạn có thể thấy trong mẫu mã ở trên.

Bản cập nhật ứng dụng và đăng ký trình xử lý

Các lượt đăng ký trình xử lý được đồng bộ hoá với phiên bản tệp kê khai mới nhất do ứng dụng cung cấp. Có 2 trường hợp:

  • Bản cập nhật thêm các trình xử lý mới sẽ kích hoạt quá trình đăng ký trình xử lý (tách biệt với quá trình cài đặt ứng dụng).
  • Bản cập nhật xoá các trình xử lý sẽ kích hoạt quá trình huỷ đăng ký trình xử lý (tách biệt với quá trình gỡ cài đặt ứng dụng).

Gỡ lỗi trình xử lý giao thức trong Công cụ cho nhà phát triển

Chuyển đến phần Protocol Handlers (Trình xử lý giao thức) thông qua ngăn Application (Ứng dụng) > Manifest (Tệp kê khai). Bạn có thể xem và kiểm thử tất cả các giao thức có sẵn tại đây.

Trình xử lý giao thức trong ngăn Manifest

Lưu ý về bảo mật

Vì quá trình cài đặt PWA yêu cầu bối cảnh phải an toàn, nên tính năng xử lý giao thức sẽ kế thừa hạn chế này. Danh sách trình xử lý giao thức đã đăng ký không được hiển thị cho web theo bất kỳ cách nào, vì vậy, danh sách này không thể được dùng làm vectơ nhận dạng.

Số lần điều hướng không do người dùng thực hiện

Những lần điều hướng không phải do người dùng thực hiện mà là do chương trình thực hiện, có thể không mở được ứng dụng. URL giao thức tuỳ chỉnh chỉ có thể được dùng trong các ngữ cảnh duyệt web cấp cao nhất, nhưng không thể dùng làm URL của một iframe, chẳng hạn như vậy.

Danh sách cho phép các giao thức

Giống như với registerProtocolHandler(), có một danh sách cho phép các giao thức mà ứng dụng có thể đăng ký để xử lý.

Trong lần đầu tiên khởi chạy PWA do một giao thức được gọi, người dùng sẽ thấy một hộp thoại cấp quyền. Hộp thoại này sẽ hiển thị tên và nguồn gốc của ứng dụng, đồng thời hỏi người dùng xem ứng dụng có được phép xử lý các đường liên kết từ giao thức hay không. Nếu người dùng từ chối hộp thoại cấp quyền, thì hệ điều hành sẽ bỏ qua trình xử lý giao thức đã đăng ký. Để huỷ đăng ký trình xử lý giao thức, người dùng cần gỡ cài đặt PWA đã đăng ký trình xử lý đó. Trình duyệt cũng sẽ huỷ đăng ký trình xử lý giao thức nếu người dùng chọn "Ghi nhớ lựa chọn của tôi" rồi chọn "Không cho phép".

Phản hồi

Nhóm Chromium muốn biết trải nghiệm của bạn khi đăng ký trình xử lý giao thức URL cho PWA.

Hãy 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 hay thuộc tính nào bị thiếu mà bạn cần triển khai ý tưởng của mình không? Bạn có câu hỏi hoặc bình luận về mô hình bảo mật? Báo cáo vấn đề về quy cách trên kho lưu trữ GitHub tương ứng hoặc thêm ý kiến của bạn vào một vấn đề hiện có.

Báo cáo vấn đề về việc triển khai

Bạn có phát hiện thấy lỗi trong quá trình triển khai Chromium không? Hoặc việc triển khai có khác với quy cách không? Báo cáo lỗi tại new.crbug.com. Nhớ cung cấp càng nhiều thông tin chi tiết càng tốt, hướng dẫn đơn giản để tái hiện và nhập UI>Browser>WebAppInstalls vào hộp Thành phần.

Thể hiện sự ủng hộ đối với API

Bạn có dự định sử dụng tính năng đăng ký trình xử lý giao thức URL cho PWA không? Sự ủng hộ công khai của bạn giúp nhóm Chromium ưu tiên các tính năng và cho các nhà cung cấp trình duyệt khác thấy tầm quan trọng của việc hỗ trợ các tính năng này.

Chia sẻ cách bạn dự định sử dụng tính năng này trên chuỗi thảo luận WICG Discourse. Gửi một tweet đến @ChromiumDev bằng thẻ bắt đầu bằng #ProtocolHandler và cho chúng tôi biết bạn đang sử dụng tính năng này ở đâu và như thế nào.

Lời cảm ơn

Việc đăng ký trình xử lý giao thức URL cho PWA được triển khai và chỉ định bởi Fabio Rocha, Diego González, Connor MoodySamuel Tang của nhóm Microsoft Edge. Bài viết này được Joe Medley và Fabio Rocha xem xét. Hình ảnh chính của JJ Ying trên Unsplash.