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 ứng dụng web (chẳng hạn như PWA) với ứng dụng Android bằ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 nguồn gốc đang mở bằng Liên kết 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 đã xác thực, giao diện người dùng của Thẻ tuỳ chỉnh sẽ xuất hiện. Thanh URL trong Thẻ tuỳ chỉnh cho người dùng biết rằng họ hiện đang điều hướng trong một miền bên ngoài ứng dụng, đồng thời cung cấp cho người dùng một nút X cho phé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 các trải nghiệm trải rộng trên nhiều nguồn gốc – Chẳng hạn như ứng dụng mua sắm với 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, bạn không nên hiển thị Thẻ tuỳ chỉnh, không chỉ vì người dùng đang ở 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ỏ qua 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 sẽ vẫn ở chế độ toàn màn hình khi di chuyển qua các nguồn đó. Cũng như miền chính, nhà phát triển phải có thể kiểm soát từng nguồn gố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ư nguồn gốc chính, quá 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ần được xác thực cần có tệp assetlinks.json riêng.

Trong ví dụ của chúng ta 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 đều được kết nối với cùng một ứng dụng Android, nên các tệp assetlinks.json sẽ giống hệt nhau.

Giả sử tên gói cho ứng dụng Android là com.example.twa, 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 phần khai báo asset_statements để chứa tất 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 các nguồn gốc bổ sung vào LauncherActivity

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

LauncherActivity là một phần của 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 bên 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 một thẻ meta-data mới vào 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 LauncherActivity tuỳ chỉnh

Khi sử dụng mã tuỳ chỉnh để chạy một Hoạt động đáng tin cậy trên web, bạn có thể thêm các 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 cho Hoạt động đáng tin cậy trên web nhiều nguồn gốc. Hãy nhớ kiểm tra.

Khắc phục sự cố

Việc 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 cần thực hiện. 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 đáng tin cậy trên web có một mục khắc phục sự cố hữu ích về cách gỡ lỗi các vấn đề liên quan đến Đường liên kết tài sản kỹ thuật số.

Ngoài ra, bạn cũng có thể dùng Công cụ liên kết tài sản của Peter để gỡ lỗi Digital Asset Links (Đường liên kết đến tài sản kỹ thuật số) trên các ứng dụng được cài đặt trên thiết bị.