Hoạt động web đáng tin cậy nhiều nguồn gốc

Hoạt động đáng tin cậy trên web là một cách mới để tích hợp nội dung trong ứng dụng web (chẳng hạn như PWA) với ứng dụng Android bằng cách sử dụng một giao thức dựa trên Thẻ tuỳ chỉnh.

điều hướng ff-origin

Hoạt động đáng tin cậy trên web cần xác thực các nguồn gốc đang được mở bằng Đường liên kết đến tài sản kỹ thuật số để hiển thị nội dung ở chế độ toàn màn hình.

Khi người dùng rời khỏi nguồn gốc đã được xác thực, giao diện người dùng Thẻ tuỳ chỉnh sẽ xuất hiện. Thanh URL trong Thẻ tuỳ chỉnh cho người dùng biết họ đang di chuyển trong một miền bên ngoài ứng dụng, đồng thời cung cấp cho người dùng nút X giúp họ nhanh chóng quay lại nguồn gốc đã xác thực.

Tuy nhiên, các Ứng dụng web cũng thường tạo ra trải nghiệm trải rộng trên nhiều nguồn gốc - Ví dụ có thể là ứng dụng mua sắm có trải nghiệm chính tại www.example.com, trong khi quy trình thanh toán được lưu trữ tại checkout.example.com.

Trong những trường hợp như vậy, việc hiển thị các Thẻ tuỳ chỉnh là không mong muốn, không chỉ vì người dùng đang ở trong cùng một ứng dụng, mà còn vì thanh trên cùng có thể khiến người dùng nghĩ rằng họ đã rời khỏi ứng dụng và bỏ ngang quy trình thanh toán.

Hoạt động đáng tin cậy trên web cho phép nhà phát triển xác thực nhiều nguồn gốc và người dùng vẫn ở chế độ toàn màn hình khi di chuyển qua các nguồn gốc đó. Tương tự như với miền chính, nhà phát triển phải có khả năng kiểm soát từng nguồn gốc đã được xác thực.

Thiết lập tính năng xác thực cho nhiều nguồn gốc

Giống như trong nguồn gốc chính, quy trình xác thực được thực hiện thông qua Đường liên kết đến tài sản kỹ thuật số và mỗi miền được xác thực cần phải có tệp assetlinks.json riêng.

Trong ví dụ với www.example.comcheckout.example.com, chúng ta sẽ có:

  • https://www.example.com/.well-known/assetlinks.json
  • https://checkout.example.com/.well-known/assetlinks.json

Vì mỗi miền đang được kết nối với cùng một ứng dụng Android, nên các tệp assetlinks.json sẽ trông y như nhau.

Giả sử tên gói của ứng dụng Android là com.example.twa, thì cả hai tệp assetlink.json sẽ chứa nội dung tương tự như sau:

[{
  "relation": ["delegate_permission/common.handle_all_urls"],
  "target": {
  "namespace": "android_app",
  "package_name": "com.example",
   "sha256_cert_fingerprints": ["..."]}
}]

Thêm nhiều nguồn gốc vào ứng dụng Android

Trên ứng dụng Android, bạn cần cập nhật nội dung khai báo asset_statements để chứa tất cả các nguồn gốc cần được xác thực:

<string name="asset_statements">
[{
    \"relation\": [\"delegate_permission/common.handle_all_urls\"],
    \"target\": {
        \"namespace\": \"web\",
        \"site\": \"https://www.example.com\"
    }
}],
[{
    \"relation\": [\"delegate_permission/common.handle_all_urls\"],
    \"target\": {
        \"namespace\": \"web\",
        \"site\": \"https://checkout.example.com\"
    }
}],
</string>

Thêm nguồn gốc bổ sung vào LauncherActivity

Sử dụng LauncherActivity mặc định

LauncherActivity thuộc thư viện hỗ trợ android-browser-helper cung cấp cách thêm nhiều nguồn gốc cần được xác thực bằng cách định cấu hình dự án Android.

Trước tiên, hãy thêm phần tử string-array vào tệp res/values/strings.xml. Mỗi URL bổ sung cần được xác thực sẽ nằm trong một phần tử phụ item:

...
<string-array name="additional_trusted_origins">
    <item>https://www.google.com</item>
</string-array>
...

Tiếp theo, hãy thêm thẻ meta-data mới bên trong phần tử hoạt động hiện có tham chiếu đến LauncherActivity, bên trong AndroidManifest.xml:

...
<activity android:name="com.google.androidbrowserhelper.trusted.LauncherActivity"
    android:label="@string/app_name">


    <meta-data
        android:name="android.support.customtabs.trusted.ADDITIONAL_TRUSTED_ORIGINS"
        android:resource="@array/additional_trusted_origins" />


    ...
</activity>
...

Sử dụng một LauncherActivity tuỳ chỉnh

Khi sử dụng mã tuỳ chỉnh để chạy Hoạt động đáng tin cậy trên web, bạn có thể thêm nguồn gốc bổ sung bằng cách gọi setAdditionalTrustedOrigins khi tạo Ý định để chạy Hoạt động đáng tin cậy trên web:

public void launcherWithMultipleOrigins(View view) {
  List<String> origins = Arrays.asList(
      "https://checkout.example.com/"
  );


  TrustedWebActivityIntentBuilder builder = new TrustedWebActivityIntentBuilder(LAUNCH_URI)
      .setAdditionalTrustedOrigins(origins);


  new TwaLauncher(this).launch(builder, null, null);
}

Kết luận

Với các bước đó, Hoạt động đáng tin cậy trên web hiện đã sẵn sàng hỗ trợ nhiều nguồn gốc. Android-browser-helper có một ứng dụng mẫu dành cho Hoạt động web đáng tin cậy đa nguồn gốc. Hãy nhớ kiểm tra điều này.

Khắc phục sự cố

Quy trình thiết lập Digital Asset Links (Đường liên kết đến tài sản kỹ thuật số) có một số phần thay đổi. Nếu ứng dụng vẫn hiện thanh Thẻ tuỳ chỉnh ở trên cùng, thì có thể đã xảy ra lỗi với cấu hình.

Hướng dẫn bắt đầu nhanh về Hoạt động trên web đáng tin cậyphần khắc phục sự cố hữu ích về cách gỡ lỗi các vấn đề liên quan đến Digital Asset Link.

Ngoài ra, còn có Peter's Asset Link Tool (Công cụ liên kết tài sản của Peter) giúp gỡ lỗi Digital Asset Links (Đường liên kết đến tài sản kỹ thuật số) trong các ứng dụng đã cài đặt trên thiết bị.