Halaman ini diterjemahkan oleh Cloud Translation API.

Mendukung aplikasi pembayaran Android di WebView menggunakan Payment Request API

Rouslan Solomakhin

Dominik Mengelt

José Luis Zapata

Anda dapat menggunakan Payment Request API untuk meluncurkan aplikasi pembayaran Android dari situs yang berjalan di dalam WebView. Hal ini berfungsi menggunakan JavaScript API yang sama yang sudah tersedia di Chrome.

Fitur ini tersedia mulai WebView versi 136, yang biasanya disertakan dengan Chrome 136.

Menyiapkan Permintaan Pembayaran di aplikasi host WebView

Untuk meluncurkan aplikasi pembayaran Android dari WebView, Payment Request API mengkueri sistem menggunakan intent Android. Untuk mendukung hal ini, aplikasi host WebView harus mendeklarasikan intent tersebut dalam file AndroidManifest.xml-nya.

Secara default, Permintaan Pembayaran dinonaktifkan di WebView.

Ikuti langkah-langkah berikut untuk mengaktifkannya menggunakan WebSettingsCompat dari AndroidX WebKit versi 1.14.0 atau yang lebih tinggi:

Langkah 1: Tambahkan dependensi AndroidX WebKit

Kotlin (build.gradle.kts)

dependencies {
  implementation("androidx.webkit:webkit:1.14.0")
}

Groovy (build.gradle)

dependencies {
  implementation 'androidx.webkit:webkit:1.14.0'
}

Katalog versi

[versions]
webkit = "1.14.0"

[libraries]
androidx-ktx = { group = "androidx.webkit", name = "webkit", version.ref = "webkit" }

Langkah 2: Impor class yang diperlukan

Class ini memungkinkan Anda mengakses dan mengonfigurasi setelan WebView serta memeriksa dukungan fitur saat runtime.

import android.webkit.WebSettings;
import android.webkit.WebView;
import androidx.webkit.WebSettingsCompat;
import androidx.webkit.WebViewFeature;

Langkah 3: Aktifkan Permintaan Pembayaran di kode WebView

Langkah ini akan mengaktifkan fitur Permintaan Pembayaran di WebView Anda dan memastikan situs dapat memicunya menggunakan JavaScript.

Kotlin (Compose)

AndroidView(
  factory = {
      WebView(it).apply {
          settings.javaScriptEnabled = true
          if (WebViewFeature.isFeatureSupported(
                  WebViewFeature.PAYMENT_REQUEST)) {
              WebSettingsCompat.setPaymentRequestEnabled(settings, true);
          }
      }
  },
  update = {it.loadUrl(url)
  }
)

Java

WebView webView = findViewById(R.id.webview);
WebSettings webSettings = mWebView.getSettings();
webSettings.setJavascriptEnabled(true);
if (WebViewFeature.isFeatureSupported(
        WebViewFeature.PAYMENT_REQUEST)) {
    WebSettingsCompat.setPaymentRequestEnabled(webSettings, true);
}

Langkah 4: Tambahkan filter intent di AndroidManifest.xml

Filter ini memungkinkan WebView menemukan dan memanggil aplikasi pembayaran Android menggunakan intent sistem:

<queries>
  <intent>
    <action android:name="org.chromium.intent.action.PAY"/>
  </intent>
  <intent>
    <action android:name="org.chromium.intent.action.IS_READY_TO_PAY"/>
  </intent>
  <intent>
    <action android:name="org.chromium.intent.action.UPDATE_PAYMENT_DETAILS"/>
  </intent>
</queries>

Gunakan intent berikut di AndroidManifest.xml untuk mendukung fitur Permintaan Pembayaran utama:

org.chromium.intent.action.PAY: Memungkinkan WebView memanggil aplikasi pembayaran Android dan menerima respons pembayaran. Pelajari lebih lanjut di panduan developer aplikasi pembayaran Android.
org.chromium.intent.action.IS_READY_TO_PAY: Memungkinkan situs memeriksa apakah pengguna telah menyiapkan metode pembayaran yang didukung. Pelajari lebih lanjut di panduan developer aplikasi pembayaran Android
org.chromium.intent.action.UPDATE_PAYMENT_DETAILS: Mendukung pembaruan dinamis, seperti saat pengguna mengubah alamat atau opsi pengiriman di aplikasi pembayaran. Pelajari lebih lanjut di Memberikan informasi pengiriman dan kontak dari aplikasi pembayaran Android.

Langkah 5: Build ulang dan publikasikan aplikasi Anda

Setelah melakukan perubahan ini, build ulang aplikasi Anda dan rilis versi yang diperbarui ke Play Store.

Opsional: Menyesuaikan pemeriksaan kesiapan

Selain meluncurkan aplikasi pembayaran Android, Payment Request API memungkinkan situs memeriksa apakah pengguna siap membayar. Misalnya, situs dapat mendeteksi apakah pengguna telah menyiapkan metode pembayaran yang didukung.

Chrome menyertakan setelan yang memungkinkan pengguna mengaktifkan atau menonaktifkan pemeriksaan ini. Aplikasi host WebView dapat menawarkan tombol serupa menggunakan:

WebSettingsCompat.setHasEnrolledInstrumentEnabled(WebSettings, boolean)

Setelan ini diaktifkan secara default (true). Jika aktif, setelan ini memungkinkan situs yang berjalan di WebView mendeteksi apakah pengguna memiliki instrumen pembayaran terdaftar.

Memeriksa dukungan Permintaan Pembayaran di JavaScript

Setelah WebSettingsCompat.setPaymentRequestEnabled(webSettings, true) dipanggil di Java atau Kotlin, antarmuka window.PaymentRequest akan tersedia di JavaScript. Ini dapat digunakan untuk deteksi fitur di halaman web:

if (window.PaymentRequest) {
  // Payment Request is available.
} else {
  // Payment Request is not available.
}

Jika window.PaymentRequest tersedia, halaman web dapat terus memulai transaksi pembayaran.

Mengintegrasikan aplikasi pembayaran Android dengan Permintaan Pembayaran

Untuk mendukung Permintaan Pembayaran, aplikasi pembayaran Android harus merespons intent sistem tertentu dan menangani data pembayaran dengan aman. Panduan ini menjelaskan cara mendaftarkan metode pembayaran, menerapkan layanan pembayaran, dan melindungi aplikasi Anda:

Panduan developer aplikasi pembayaran Android: Mem-build dan mengonfigurasi aplikasi pembayaran, termasuk cara menangani intent dan memverifikasi aplikasi panggilan.
Menyiapkan metode pembayaran: Mendaftarkan metode pembayaran dan menentukan kemampuannya.

Mengamankan aplikasi Anda dari penyalahgunaan

Aplikasi apa pun dapat memanggil intent pembayaran Android org.chromium.intent.action.PAY, IS_READY_TO_PAY, dan UPDATE_PAYMENT_DETAILS. Aplikasi host WebView juga dapat mengamati, memulai, dan mencegat panggilan Permintaan Pembayaran. Karena WebView berjalan di dalam proses aplikasi host, WebView tidak dapat membatasi cara penggunaan intent ini. Aplikasi berbahaya dapat mengeksploitasinya untuk meluncurkan serangan oracle.

Dalam serangan oracle, aplikasi pembayaran secara tidak sengaja mengungkapkan informasi yang tidak seharusnya. Misalnya, penyerang mungkin menggunakan IS_READY_TO_PAY untuk menemukan instrumen pembayaran yang tersedia bagi pengguna.

Anda harus membuat perlindungan ke dalam aplikasi pembayaran untuk melindungi dari penyalahgunaan semacam ini.

Gunakan strategi berikut untuk mengurangi penyalahgunaan:

Membatasi permintaan: Batasi frekuensi aplikasi Anda merespons IS_READY_TO_PAY. Misalnya, hanya respons sekali setiap 30 menit.
Gunakan enkripsi: Enkripsi respons sensitif sehingga hanya server penjual tepercaya Anda yang dapat mendekripsinya. Selalu lakukan enkripsi dan dekripsi di sisi server.
Batasi akses: Mengelola daftar yang diizinkan untuk aplikasi host WebView tepercaya menggunakan nama paket dan sertifikat penandatanganan SHA256. Pelajari lebih lanjut di panduan developer aplikasi pembayaran Android.