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

Khởi động PWA trong ứng dụng Android

Ứng dụng web tiến bộ (PWA) là các ứng dụng web 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à cung cấp những cách mạnh mẽ giúp người dùng khám phá trải nghiệm mới. Tuy nhiên, người dùng cũng quen tìm kiếm các ứ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ụ họ đang tìm kiếm và có ý định cao, dẫn đến chỉ số tương tác cao hơn mức trung bình.

Cửa hàng Play là cửa hàng dành cho các ứ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ừ các ứng dụng Android của họ.

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

Các giải pháp hiện tại đã 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ư WebView trên Android hoặc các khung như Cordova.

Hạn chế của WebView trên Android là WebView không được 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 và không cung cấp đầy đủ quyền truy cập vào các tính năng trên nền tảng web hiện đại như bộ chọn danh bạ hoặc hệ thống tệp, cùng nhiều tính năng khác.

EIE được thiết kế để tăng cường những thiếu sót của WebView, nhưng sau đó các API này chỉ được giới hạn trong môi trường Clang. Đ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 của Đồ cũ cho ứng dụng Android, tách biệt với PWA trên web mở.

Ngoài ra, khả năng phát hiện tính năng thường không phải lúc nào cũng hoạt động như mong đợi và vấn đề về khả năng tương thích giữa các phiên bản Android cũng như nhà sản xuất thiết bị gốc (OEM) cũng có thể là vấn đề. Khi sử dụng một trong những giải pháp đó, nhà phát triển cần có thêm 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ìm 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ể 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 ứ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ó cùng khả năng tương thích với các tính năng và API của Nền tảng web như trình duyệt cơ bản. Ngoài ra, chúng tôi còn có các tiện ích nguồn mở giúp việc triển khai ứng dụng Android bằng cách sử dụng Hoạt động đáng tin cậy trên web thậm chí còn dễ dàng hơn nữa.

Một ưu điểm 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 giữa các trải nghiệm.

Khả năng tương thích của trình duyệt

Tính năng này đã có trong Chrome kể từ phiên bản 75, và Firefox triển khai tính năng này trong phiên bản chạy vào ban đê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 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 khiến việc không xử lý được các trường hợp sau đây sẽ bị coi là sự cố:

  • Không xác minh được các đường liên kết đến tài sản kỹ thuật số khi chạy ứng dụng.
  • Không trả về được 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 các trường hợp đó xảy ra trong Hoạt động đáng tin cậy trên web, điều này sẽ gây ra sự cố hiển thị với người dùng của ứng dụng Android. Hãy xem hướng dẫn về cách xử lý các trường hợp đó trong trình chạy 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ó đáp ứng các tiêu chí về khả năng cài đặt hay không.

Công cụ

Nhà phát triển web muốn tận dụ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 một Ứng dụng Android. Ngoài ra, 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).

Bong bóng trò chuyện

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

Bạn có thể khởi động quy trình tự thân khởi động một dự án mới bằng cách chạy công cụ này và chuyể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à 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ộ. Công cụ này cũng tích hợp với Bubblewrap để cung cấp giao diện GUI nhằm 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 hay trên blog về cách tạo một ứ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 đang xây dựng một Ứng dụng web tiến bộ tuyệt vời sẽ không muốn một nhà phát triển khác xây dựng một ứng dụng Android bằng ứng dụng đó mà không có sự cho phép của họ. Để đả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 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ước cuối cùng vẫn còn, đó 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 mà người dùng đang tải xuống.

Khoá có thể được tạo theo nhiều cách và cách dễ nhất để tìm ra khoá đã ký tệp 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ị một ứng dụng bị lỗi cho người dùng, hãy triển khai ứng dụng đó trên một kênh thử nghiệm khép kín, cài đặt ứng dụng đó vào thiết bị thử nghiệm rồi dùng Công cụ liên kết tài sản của Peter để tạo đúng tệp assetlinks.json cho ứng dụng. Hãy mở 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

Progressive Web App là 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ừ ứng dụng Android khi các trải nghiệm đó đáp ứng các tiêu chí tối thiểu về chất lượng.

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 xây dựng một ứng dụng web tiến bộ (PWA) hiệu quả. Đối với các nhà phát triển đã có PWA, hãy sử dụng Lighthouse để xác minh xem ứng dụng đó có đáp ứng các tiêu chí về 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 thử nghiệm khép kín trên Cửa hàng Play rồi 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!