Check out what’s new from Firebase at Google I/O 2022. Learn more

Mengubah Pengguna Web Seluler menjadi Pengguna Aplikasi Native

Bayangkan jika Anda sudah bersusah payah membuat situs seluler yang bagus dan aplikasi native yang menarik, tapi ternyata rasio konversi Anda di aplikasi native lebih bagus daripada di web. Dalam kasus ini, mengonversi pengguna web seluler untuk mendownload aplikasi mungkin dapat meningkatkan kemajuan bisnis Anda. Mendorong pengguna untuk beralih dari web seluler ke aplikasi native mungkin memang sulit, tetapi Dynamic Links dapat mempermudahnya. Dengan menambahkan sedikit kode, Anda dapat memungkinkan pengguna yang mengklik link di web seluler untuk diarahkan ke halaman yang sesuai dalam aplikasi, meskipun mereka harus membuka App Store atau Google Play Store untuk menginstalnya terlebih dahulu.

Manfaat utama

  • Mengubah pengguna web seluler menjadi pengguna aplikasi native, sekaligus menjadikan proses transisi tersebut berjalan senyaman mungkin bagi mereka.
  • Pengguna dapat melihat konten yang sama dengan yang mereka lihat di situs Anda saat memulai aplikasi.
  • Hanya memerlukan integrasi yang minimal.

Berikut cara memulainya.

Sebelum memulai

Buat agar konten aplikasi Anda dapat menerima deep link

Kunci untuk mengonversi pengguna web seluler menjadi pengguna aplikasi native adalah memastikan pengguna melihat konten yang sama seperti yang mereka lihat di web saat membuka aplikasi. Jadi, sebelum mulai mengirim pengguna web seluler ke aplikasi, aplikasi Anda harus dapat menerima deep link ke konten.

Jika Anda telah menerapkan iOS Universal Links atau Android App Links, Anda mungkin telah menyelesaikan tugas ini. Namun, jika belum, tambahkan logika ke aplikasi yang menggunakan URL dari situs Anda dan menampilkan konten yang sesuai dalam aplikasi kepada pengguna.

Siapkan project Firebase baru dan instal Dynamic Links SDK ke dalam aplikasi Anda. (iOS, Android, C++, Unity). Dengan menginstal Dynamic Links SDK, Firebase dapat meneruskan data tentang Dynamic Link setelah pengguna menginstal aplikasi. Tanpa SDK ini, tidak ada cara untuk menghubungkan pengguna pascapenginstalan dengan klik prapenginstalan.

Kini saatnya menyiapkan link yang akan mengarahkan pengguna dari situs ke aplikasi native Anda. Jangan khawatir, jika pengguna belum menginstal aplikasi Anda, Dynamic Links bisa mengurusnya untuk Anda.

Buat Dynamic Link secara dinamis di setiap halaman situs Anda. Karena konten Anda sudah dapat menerima deep link, parameter link bisa berupa URL halaman yang memuat konten tersebut.

Berikut tampilan link tersebut:

<a href="https://example.page.link/?link=https://www.example.com/content?item%3D1234&apn=com.example.android&ibi=com.example.ios">Open this page in our app!</a>

Saat pengguna membuka link ini di perangkatnya, jika aplikasi yang ditentukan oleh parameter apn (di Android) atau parameter ibi (di iOS) tidak terinstal, pengguna akan diarahkan ke Play Store atau App Store untuk menginstal aplikasi tersebut. Selanjutnya, aplikasi ini akan terbuka, dan URL yang ditentukan dalam parameter link akan diteruskan ke sana.

Membuka konten yang tertaut di aplikasi Anda

Selanjutnya, Anda harus menerima link yang diteruskan ke aplikasi dan membuka konten yang tertaut, yang mudah dilakukan menggunakan Dynamic Links SDK:

iOS

Di iOS, Anda menerima Dynamic Link dengan menerapkan metode application:continueUserActivity:restorationHandler:. Di pengendali pemulihan, Anda bisa mendapatkan Dynamic Link dengan memanggil handleUniversalLink:completion:. Jika Dynamic Link diteruskan ke aplikasi, Anda bisa mendapatkannya dari properti url pada FIRDynamicLink. Contoh:

Objective-C

Catatan: Produk Firebase ini tidak tersedia di target macOS, Mac Catalyst, tvOS, atau watchOS.
[[FIRDynamicLinks dynamicLinks]
    handleUniversalLink:userActivity.webpageURL
             completion:^(FIRDynamicLink * _Nullable dynamicLink,
                          NSError * _Nullable error) {
      NSString *link = dynamicLink.url;
    }];

Swift

Catatan: Produk Firebase ini tidak tersedia di target macOS, Mac Catalyst, tvOS, atau watchOS.
FIRDynamicLinks.dynamicLinks()?.handleUniversalLink(userActivity.webpageURL!) { (dynamiclink, error) in
    let link = dynamiclink.url
}

Selain itu, Anda harus memanggil dynamicLinkFromCustomSchemeURL: dalam metode application:openURL:options: untuk menerima Dynamic Link yang diteruskan ke aplikasi Anda sebagai URL skema kustom. Misalnya:

Objective-C

Catatan: Produk Firebase ini tidak tersedia di target macOS, Mac Catalyst, tvOS, atau watchOS.
FIRDynamicLink *dynamicLink = [[FIRDynamicLinks dynamicLinks] dynamicLinkFromCustomSchemeURL:url];
if (dynamicLink) {
  NSString *link = dynamicLink.url;
  // ...
  return YES;
}

Swift

Catatan: Produk Firebase ini tidak tersedia di target macOS, Mac Catalyst, tvOS, atau watchOS.
let dynamicLink = FIRDynamicLinks.dynamicLinks()?.dynamicLinkFromCustomSchemeURL(url)
if let dynamicLink = dynamicLink {
  let link = dynamiclink.url
  // ...
  return true
}

Setelah Anda mendapatkan nilai parameter link, tampilkan konten yang ditautkan kepada pengguna.

Android

Di Android, Anda harus menggunakan metode getDynamicLink() untuk mendapatkan data dari Dynamic Link:

Java

FirebaseDynamicLinks.getInstance()
        .getDynamicLink(getIntent())
        .addOnCompleteListener(new OnCompleteListener<PendingDynamicLinkData>() {
            @Override
            public void onComplete(@NonNull Task<PendingDynamicLinkData> task) {
                if (!task.isSuccessful()) {
                    // Handle error
                    // ...
                }

                FirebaseAppInvite invite = FirebaseAppInvite.getInvitation(task.getResult());
                if (invite != null) {
                    // Handle invite
                    // ...
                }
            }
        });

Kotlin+KTX

Firebase.dynamicLinks
        .getDynamicLink(intent)
        .addOnCompleteListener { task ->
            if (!task.isSuccessful) {
                // Handle error
                // ...
            }

            val invite = FirebaseAppInvite.getInvitation(task.result)
            if (invite != null) {
                // Handle invite
                // ...
            }
        }

Setelah Anda mendapatkan nilai parameter link, tampilkan konten yang ditautkan kepada pengguna.