Sử dụng PWA trong ứng dụng Android

Ứng dụng web tiến bộ (PWA) là các ứng dụng web sử dụng các tính năng giống như ứng dụng để tạo ra trải nghiệm chất lượng cao, nhanh chóng, đáng tin cậy và hấp dẫn.

Web có phạm vi tiếp cận đáng kinh ngạc và mang đến cho người dùng những cách thức hiệu quả để khám phá trải nghiệm mới. Tuy nhiên, người dùng cũng quen với việc tìm kiếm ứng dụng trong cửa hàng hệ điều hành của họ. Trong nhiều trường hợp, những người dùng đó đã quen thuộc với thương hiệu hoặc dịch vụ mà họ đang tìm kiếm và có mức độ chủ ý cao, dẫn đến các chỉ số tương tác cao hơn mức trung bình.

Cửa hàng Play là một cửa hàng dành cho ứng dụng Android và các nhà phát triển thường muốn mở Ứng dụng web tiến bộ từ ứng dụng Android của họ.

Hoạt động web đáng tin cậy là một tiêu chuẩn mở cho phép trình duyệt cung cấp một vùng chứa tương thích hoàn toàn với nền tảng web hiển thị PWA bên trong một ứng dụng Android. Tính năng này có trong Chrome và đang được phát triển trong Firefox Nightly.

Các giải pháp hiện có bị hạn chế

Bạn luôn có thể đưa trải nghiệm web vào ứng dụng Android bằng cách sử dụng các công nghệ như Android WebView hoặc các khung như Cordova.

Hạn chế của Android WebView là không dùng để thay thế trình duyệt. Android WebView là một công cụ dành cho nhà phát triển để sử dụng giao diện người dùng web trong ứng dụng Android. Công cụ này không cung cấp quyền truy cập đầy đủ vào các tính năng hiện đại của nền tảng web như bộ chọn người liên hệ hoặc hệ thống tệp, và các tính năng khác.

Cordova được thiết kế để khắc phục những thiếu sót của WebView, nhưng sau đó các API lại bị giới hạn ở môi trường Cordova. Điều đó có nghĩa là bạn cần duy trì một cơ sở mã bổ sung để sử dụng các API Cordova cho ứng dụng Android, tách biệt với PWA trên web mở.

Ngoài ra, khả năng khám phá tính năng thường không phải lúc nào cũng hoạt động như mong đợi và các vấn đề về khả năng tương thích giữa các phiên bản Android và nhà sản xuất thiết bị gốc (OEM) cũng có thể là một vấn đề. Khi sử dụng một trong những giải pháp đó, nhà phát triển cần thêm các quy trình đảm bảo chất lượng và phải chịu thêm chi phí phát triển để phát hiện và tạo giải pháp.

Hoạt động đáng tin cậy trên web là một vùng chứa mới cho các ứng dụng web trên Android

Giờ đây, nhà phát triển có thể sử dụng Hoạt động đáng tin cậy trên web làm vùng chứa để đưa PWA vào làm hoạt động khởi chạy cho ứng dụng Android. Công nghệ này tận dụng trình duyệt để hiển thị PWA ở chế độ toàn màn hình, đảm bảo Hoạt động đáng tin cậy trên web có khả năng tương thích giống với các tính năng và API của Nền tảng web mà trình duyệt cơ bản có. Ngoài ra, còn có các tiện ích nguồn mở giúp việc triển khai ứng dụng Android bằng Hoạt động đáng tin cậy trên web trở nên dễ dàng hơn.

Một lợi thế khác không có trong các giải pháp khác là vùng chứa chia sẻ bộ nhớ với trình duyệt. Trạng thái đăng nhập và lựa chọn ưu tiên của người dùng được chia sẻ liền mạch trên các trải nghiệm.

Khả năng tương thích với trình duyệt

Tính năng này đã có trong Chrome kể từ phiên bản 75, còn Firefox triển khai tính năng này trong phiên bản thử nghiệm.

Tiêu chí về chất lượng

Nhà phát triển web nên sử dụng Hoạt động đáng tin cậy trên web khi muốn đưa nội dung web vào một ứng dụng Android.

Nội dung web trong một Hoạt động đáng tin cậy trên web phải đáp ứng các tiêu chí về khả năng cài đặt PWA.

Ngoài ra, để phù hợp với hành vi mà người dùng mong đợi từ các ứng dụng Android, Chrome 86 đã ra mắt một thay đổi, trong đó việc không xử lý được các trường hợp sau đây được coi là sự cố:

  • Không xác minh được đường liên kết đến tài sản kỹ thuật số khi khởi chạy ứng dụng.
  • Không thể trả về HTTP 200 cho yêu cầu tài nguyên mạng ngoại tuyến.
  • Yêu cầu điều hướng trả về lỗi HTTP 404 hoặc 5xx".

Khi một trong những trường hợp đó xảy ra trong Hoạt động web đáng tin cậy, ứng dụng Android sẽ gặp sự cố mà người dùng có thể nhìn thấy. Hãy xem hướng dẫn về cách xử lý các tình huống đó trong worker dịch vụ.

Ứng dụng cũng phải đáp ứng các tiêu chí bổ sung dành riêng cho Android như tuân thủ chính sách.

Ảnh chụp màn hình cho thấy điểm Lighthouse của AirHorn, với huy hiệu PWA và điểm hiệu suất là 100.
Huy hiệu PWA trong Lighthouse cho biết liệu PWA của bạn có vượt qua các tiêu chí về khả năng cài đặt hay không.

Công cụ

Những nhà phát triển web muốn tận dụng tính năng Hoạt động đáng tin cậy trên web không cần phải tìm hiểu các công nghệ hoặc API mới để chuyển đổi PWA thành Ứng dụng Android. Cùng nhau, Bubblewrap và PWABuilder cung cấp công cụ cho nhà phát triển dưới dạng thư viện, Giao diện dòng lệnh (CLI) và Giao diện người dùng đồ hoạ (GUI).

Màng xốp hơi

Dự án Bubblewrap tạo ứng dụng Android ở dạng thư viện NodeJS và Giao diện dòng lệnh (CLI).

Quá trình tự khởi động cho một dự án mới đạt được bằng cách chạy công cụ này và truyền URL của Tệp kê khai web:

npx @bubblewrap/cli init --manifest=https://pwa-directory.appspot.com/manifest.json

Công cụ này cũng có thể tạo dự án và việc chạy lệnh bên dưới sẽ tạo ra một ứng dụng Android sẵn sàng để tải lên Cửa hàng Play:

npx @bubblewrap/cli build

Sau khi chạy lệnh này, một tệp có tên là app-release-signed.apk sẽ xuất hiện trong thư mục gốc của dự án. Đây là tệp sẽ được tải lên Cửa hàng Play.

PWABuilder

PWABuilder giúp nhà phát triển chuyển đổi các trang web hiện có thành Ứng dụng web tiến bộ. Thư viện này cũng tích hợp với Bubblewrap để cung cấp giao diện GUI để gói các PWA đó vào một ứng dụng Android. Nhóm PWABuilder đã tổng hợp một bài đăng thú vị trên blog về cách tạo ứng dụng Android bằng công cụ này.

Xác minh quyền sở hữu PWA trong ứng dụng Android

Một nhà phát triển xây dựng một Ứng dụng web tiến bộ tuyệt vời không muốn một nhà phát triển khác dùng ứng dụng Android đó khi chưa được họ cho phép. Để đảm bảo điều này không xảy ra, ứng dụng Android phải được ghép nối với Ứng dụng web tiến bộ bằng một công cụ có tên là Digital Asset Links (Đường liên kết đến tài sản kỹ thuật số).

Bubblewrap và PWABuilder sẽ xử lý cấu hình cần thiết trên ứng dụng Android, nhưng bạn vẫn còn một bước cuối cùng là thêm tệp assetlinks.json vào PWA.

Để tạo tệp này, nhà phát triển cần có chữ ký SHA-256 của khoá dùng để ký APK đang được người dùng tải xuống.

Bạn có thể tạo khoá theo nhiều cách và cách dễ nhất để tìm khoá đã ký APK được phân phát cho người dùng cuối là tải khoá đó xuống từ chính Cửa hàng Play.

Để tránh hiển thị ứng dụng bị lỗi cho người dùng, hãy triển khai ứng dụng đó cho một kênh kiểm thử khép kín, cài đặt ứng dụng đó vào một thiết bị kiểm thử, sau đó sử dụng Công cụ liên kết tài sản của Peter để tạo tệp assetlinks.json chính xác cho ứng dụng. Cung cấp tệp assetlinks.json đã tạo tại /.well-known/assetlinks.json, trong miền đang được xác thực.

Điểm đến tiếp theo

Ứng dụng web tiến bộ là một trải nghiệm web chất lượng cao. Hoạt động đáng tin cậy trên web là một cách mới để mở những trải nghiệm chất lượng cao đó từ một ứng dụng Android khi ứng dụng đó đáp ứng các tiêu chí chất lượng tối thiểu.

Nếu bạn mới bắt đầu sử dụng Ứng dụng web tiến bộ, hãy đọc hướng dẫn của chúng tôi về cách tạo một PWA chất lượng cao. Đối với những nhà phát triển đã có PWA, hãy sử dụng Lighthouse để xác minh xem PWA đó có đáp ứng các tiêu chí chất lượng hay không.

Sau đó, hãy sử dụng Bubblewrap hoặc PWABuilder để tạo ứng dụng Android, tải ứng dụng lên một kênh kiểm thử khép kín trên Cửa hàng Play và ghép nối ứng dụng đó với PWA bằng Công cụ liên kết tài sản của Peter.

Cuối cùng, hãy chuyển ứng dụng của bạn từ kênh thử nghiệm khép kín sang kênh phát hành công khai!