Penyiapan Aktivitas Web Tepercaya bisa sedikit sulit, terutama jika Anda hanya ingin menampilkan situs Anda. Panduan ini akan memandu Anda membuat proyek dasar yang menggunakan Aktivitas Web Tepercaya, membahas semua hal penting.
Di akhir panduan ini, Anda akan:
- Telah menggunakan Bubblewrap untuk membangun aplikasi yang menggunakan Aktivitas Web Tepercaya dan lolos verifikasi.
- Memahami kapan kunci penandatanganan Anda digunakan.
- Mampu menentukan tanda tangan yang digunakan untuk membangun Aplikasi Android Anda.
- Mengetahui cara membuat file Digital Asset Links dasar.
Untuk mengikuti panduan ini, Anda perlu:
- Node.js 10 atau yang lebih baru yang diinstal di komputer pengembangan.
- Ponsel atau emulator Android yang terhubung dan disiapkan untuk pengembangan (Aktifkan proses debug USB jika Anda menggunakan ponsel fisik).
- Browser yang mendukung Aktivitas Web Tepercaya di ponsel pengembangan Anda. Chrome 72 atau yang lebih baru akan berfungsi. Dukungan di browser lain akan segera hadir.
- Situs yang ingin Anda lihat di Aktivitas Web Tepercaya.
Aktivitas Web Tepercaya memungkinkan Aplikasi Android meluncurkan Tab Browser layar penuh tanpa UI browser apa pun. Kemampuan ini dibatasi pada situs web yang Anda miliki, dan Anda membuktikannya dengan menetapkan Digital Asset Links. Kita akan membahasnya lebih lanjut nanti.
Saat Anda meluncurkan Aktivitas Web Tepercaya, browser akan memeriksa apakah Digital Asset Links memeriksa verifikasi, hal ini disebut verifikasi. Jika verifikasi gagal, browser akan kembali menampilkan situs Anda sebagai Tab Kustom.
Menginstal dan mengonfigurasikan Bubblewrap
Bubblewrap adalah kumpulan library dan perintah alat baris (CLI) untuk Node.js yang membantu developer membuat, membangun, dan menjalankan Progressive Web App di dalam aplikasi Android, menggunakan Trusted Web Activity.
CLI dapat diinstal dengan perintah berikut:
npm i -g @bubblewrap/cli
Menyiapkan Lingkungan
Ketika menjalankan Bubblewrap untuk pertama kalinya, aplikasi akan menawarkan untuk mengunduh dan menginstal secara otomatis dependensi eksternal yang diperlukan. Sebaiknya izinkan alat tersebut melakukannya, karena menjamin bahwa dependensi dikonfigurasi dengan benar. Periksa dokumentasi Bubblewrap untuk menggunakan Java Development Kit (JDK) atau penginstalan alat baris perintah Android yang sudah ada.
Menginisialisasi dan mem-build project
Memulai project Android yang menggabungkan PWA dilakukan dengan menjalankan perintah init:
bubblewrap init --manifest=https://my-twa.com/manifest.json
Bubblewrap akan membaca Manifes Web, minta developer untuk mengonfirmasi nilai yang akan digunakan dalam project Android, dan membuat project menggunakan nilai-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 Play Store untuk dirilis.
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 berupa data
adb install app-release-signed.apk
Aplikasi kini telah tersedia di peluncur perangkat. Saat membuka aplikasi Anda akan perhatikan bahwa situs Anda diluncurkan sebagai Tab Khusus, bukan Aktivitas Web Tepercaya, ini adalah karena kita belum menyiapkan validasi Digital Asset Links, tapi pertama-tama...
Alternatif Antarmuka Pengguna Grafis (GUI) untuk Bubblewrap
PWA Builder menyediakan antarmuka GUI yang menggunakan Bubblewrap untuk mendukung pembuatan project Aktivitas Web Tepercaya. Temukan petunjuk lebih lanjut tentang cara menggunakan PWA Builder untuk membuat Aplikasi Android yang membuka PWA Anda di postingan blog ini.
Catatan tentang kunci penandatanganan
Digital Asset Links mempertimbangkan kunci yang digunakan untuk menandatangani APK dan penyebab umum kegagalan verifikasi adalah penggunaan tanda tangan yang salah. (Ingat, jika verifikasi gagal, Anda akan meluncurkan situs sebagai Tab Khusus dengan UI browser di bagian atas halaman.) Saat Bubblewrap membangun aplikasi, APK akan dibuat dengan penyiapan kunci selama langkah init. Namun, saat Anda memublikasikan aplikasi di Google Play, kunci lain mungkin dibuat untuk Anda, bergantung pada cara Anda memilih untuk menangani kunci penandatanganan. Pelajari lebih lanjut kunci penandatanganan dan kaitannya dengan Bubblewrap dan Google Play.
Menyiapkan file link aset
Digital Asset Links pada dasarnya terdiri dari sebuah file di situs yang mengarah ke aplikasi Anda dan beberapa metadata di aplikasi yang mengarah ke situs Anda.
Setelah membuat file assetlinks.json, upload file tersebut ke situs Anda di .well-known/assetlinks.json yang relatif terhadap root) sehingga aplikasi Anda dapat diverifikasi dengan benar oleh browser. Lihat pembahasan mendalam tentang Digital Asset Links untuk mengetahui informasi selengkapnya tentang kaitannya dengan kunci penandatanganan Anda.
Memeriksa browser Anda
Aktivitas Web Tepercaya akan mencoba mematuhi pilihan default browser pengguna. Jika browser default pengguna mendukung Aktivitas Web Tepercaya, browser akan diluncurkan. Jika browser terinstal mendukung Aktivitas Web Tepercaya, tindakan tersebut akan dipilih jika tidak disetujui. Akhirnya, perilaku default adalah kembali ke mode Tab Khusus.
Artinya, jika Anda men-debug sesuatu yang berkaitan dengan Aktivitas Web Tepercaya, Anda harus pastikan bahwa Anda menggunakan browser yang Anda kira. Anda dapat menggunakan perintah berikut untuk memeriksa browser mana yang sedang digunakan:
> adb logcat -v brief | grep -e TWAProviderPicker
D/TWAProviderPicker(17168): Found TWA provider, finishing search: com.google.android.apps.chrome
Langkah Berikutnya
Mudah-mudahan, jika Anda mengikuti panduan ini, Anda akan memiliki Aktivitas Web Tepercaya yang berfungsi dan memiliki cukup pengetahuan untuk men-debug apa yang terjadi jika verifikasi gagal. Jika belum, lihat konsep Android untuk developer web lainnya atau ajukan masalah GitHub ke dokumen ini.
Untuk langkah selanjutnya, sebaiknya Anda memulai dengan membuat ikon untuk aplikasi Anda. Setelah itu, Anda dapat mempertimbangkan untuk men-deploy aplikasi ke Play Store.