Mulai cepat Aktivitas Web Tepercaya

Peter Conn
Peter Conn

Aktivitas Web Tepercaya dapat sulit disiapkan, terutama jika Anda hanya ingin menampilkan situs. Panduan ini mengajarkan cara membuat project kecil yang menggunakan Aktivitas Web Tepercaya.

Setelah membaca panduan ini, Anda akan:

  • Menggunakan Bubblewrap untuk mem-build aplikasi yang menggunakan Aktivitas Web Tepercaya dan lulus verifikasi.
  • Memahami kapan kunci penandatanganan Anda digunakan.
  • Dapat menentukan tanda tangan yang digunakan untuk mem-build Aplikasi Android Anda.
  • Mengetahui cara membuat file Digital Asset Links dasar.

Untuk mengikuti panduan ini, Anda memerlukan:

  • Node.js 10 atau yang lebih baru.
  • Ponsel atau emulator Android, yang terhubung dan disiapkan untuk pengembangan. Aktifkan proses debug USB jika Anda menggunakan ponsel fisik.
  • Browser seluler yang mendukung Aktivitas Web Tepercaya.
  • Situs yang ingin Anda lihat di Aktivitas Web Tepercaya.

Anda dapat menggunakan Aktivitas Web Tepercaya untuk Aplikasi Android guna meluncurkan tab browser layar penuh, tanpa UI browser. Kemampuan ini hanya dapat digunakan untuk situs yang Anda miliki. Anda membuktikan kepemilikan dengan menyiapkan Digital Asset Links.

Saat Anda meluncurkan Aktivitas Web Tepercaya, browser akan memverifikasi Digital Asset Links. Jika verifikasi gagal, browser akan kembali menampilkan situs Anda sebagai Tab Kustom.

Menginstal dan mengonfigurasi Bubblewrap

Bubblewrap adalah kumpulan library dan alat command line (CLI) untuk Node.js yang membantu developer membuat, mem-build, dan menjalankan Aplikasi Web Progresif di dalam aplikasi Android, menggunakan Aktivitas Web Tepercaya.

Instal CLI dengan menjalankan perintah ini:

npm i -g @bubblewrap/cli

Menyiapkan Lingkungan

Saat menjalankan Bubblewrap untuk pertama kalinya, Anda akan diminta untuk otomatis mendownload dan menginstal dependensi eksternal yang diperlukan. Sebaiknya izinkan download otomatis, karena hal ini membantu memastikan dependensi dikonfigurasi dengan benar. Lihat dokumentasi Bubblewrap untuk menggunakan Java Development Kit (JDK) yang ada atau penginstalan alat command line Android.

Menginisialisasi dan mem-build project

Inisialisasi project Android yang menggabungkan PWA:

bubblewrap init --manifest=https://my-twa.com/manifest.json

Bubblewrap membaca Manifest Web, meminta developer untuk mengonfirmasi nilai yang akan digunakan dalam project Android, dan membuat project menggunakan nilai tersebut.

Setelah project dibuat, buat APK dengan menjalankan:

bubblewrap build

Jalankan

Langkah build akan menghasilkan file bernama app-release-signed.apk. File ini dapat diinstal di perangkat pengembangan untuk pengujian atau diupload ke Google Play Store untuk rilis.

Bubblewrap menyediakan perintah untuk menginstal dan menguji aplikasi di perangkat lokal. Dengan perangkat pengembangan yang terhubung ke komputer, jalankan:

bubblewrap install

Atau, alat adb dapat digunakan.

adb install app-release-signed.apk

Aplikasi kini akan tersedia di peluncur perangkat.

Saat membuka aplikasi, Anda akan melihat bahwa situs Anda diluncurkan sebagai Tab Kustom, bukan Aktivitas Web Tepercaya. Hal ini karena kita belum menyiapkan validasi Digital Asset Links.

Alternatif Antarmuka Pengguna Grafis (GUI) untuk Bubblewrap

PWA Builder menyediakan antarmuka GUI yang menggunakan library Bubblewrap untuk mendukung pembuatan project Aktivitas Web Tepercaya. Temukan petunjuk cara menggunakan PWA Builder untuk membuat Aplikasi Android yang membuka PWA Anda.

Kunci penandatanganan

Digital Asset Links mempertimbangkan kunci yang digunakan untuk menandatangani APK dan penyebab umum kegagalan verifikasi adalah penggunaan tanda tangan yang salah. (Ingat, kegagalan verifikasi berarti Anda akan meluncurkan situs sebagai Tab Kustom dengan UI browser di bagian atas halaman.) Saat Bubblewrap mem-build aplikasi, APK akan dibuat dengan penyiapan kunci selama langkah init. Namun, saat Anda memublikasikan aplikasi di Google Play, kunci lain dapat dibuat untuk Anda, bergantung pada cara Anda menangani kunci penandatanganan. Pelajari lebih lanjut kunci penandatanganan dan hubungannya dengan Bubblewrap dan Google Play.

Digital Asset Links pada dasarnya terdiri dari file di situs Anda yang mengarah ke aplikasi Anda dan beberapa metadata di aplikasi Anda yang mengarah ke situs Anda.

Setelah membuat file assetlinks.json, upload ke situs Anda di .well-known/assetlinks.json relatif terhadap root) agar aplikasi Anda dapat diverifikasi dengan benar oleh browser. Lihat pembahasan mendalam tentang Digital Asset Links untuk mengetahui informasi selengkapnya tentang hubungannya dengan kunci penandatanganan Anda.

Memeriksa browser

Aktivitas Web Tepercaya akan mencoba mematuhi pilihan browser default pengguna. Jika browser default pengguna mendukung Aktivitas Web Tepercaya, browser tersebut akan diluncurkan. Jika tidak, browser terinstal yang mendukung Aktivitas Web Tepercaya akan dipilih. Terakhir, perilaku default adalah kembali ke mode Tab Kustom.

Artinya, jika Anda melakukan proses debug terkait Aktivitas Web Tepercaya, pastikan Anda menggunakan browser yang menurut Anda gunakan. Anda dapat menggunakan perintah berikut untuk memeriksa browser yang digunakan:

> adb logcat -v brief | grep -e TWAProviderPicker
D/TWAProviderPicker(17168): Found TWA provider, finishing search: com.google.android.apps.chrome

Langkah berikutnya

Semoga, jika Anda telah mengikuti panduan ini, Anda memiliki Aktivitas Web Tepercaya yang berfungsi dan pengetahuan yang cukup untuk melakukan proses debug jika verifikasi gagal. Jika tidak, lihat konsep Android lainnya untuk developer web.

Untuk langkah berikutnya, buat ikon untuk aplikasi Anda. Setelah selesai, Anda dapat mempertimbangkan untuk men-deploy aplikasi ke Google Play Store.