Checkout kripto di situs vs redirect: konversi dan trade-off
Checkout kripto tertanam vs redirect: bagaimana tiap model memengaruhi konversi, kontrol, dan usaha. Widget Qvard sudah live. Bandingkan pendekatan dan pilih yang tepat.
Checkout kripto tertanam menjaga pembayaran tetap di dalam halaman Anda, sedangkan redirect mengirim pelanggan ke halaman hosted. Tiap model punya trade-off dalam konversi, kontrol, dan usaha. Widget Qvard sudah tersedia, jadi panduan ini membandingkan kedua pendekatan dan menunjukkan cara memilih.
Apa itu checkout tertanam
Checkout tertanam adalah jendela pembayaran yang terbuka langsung di halaman Anda melalui widget JavaScript. Bisa berupa jendela modal (di atas konten) atau formulir tertanam. Pelanggan tetap dalam konteks situs Anda dan membayar tanpa pergi. Logika pembayaran sama dengan halaman hosted; hanya presentasinya yang berbeda.
Cara kerja di Qvard
Widget dimuat dari https://qvard.com/checkout.js dan membuka jendela pembayaran sebagai modal (pop-up) atau tertanam dalam elemen. Jendela adalah halaman pembayaran Qvard yang sama: pelanggan memilih aset dan jaringan, nominal tetap menurut pesanan Anda. Instance widget menerima kunci publik Anda (qvard_pk_...) untuk membuat pembayaran di browser, atau id pembayaran untuk membuat di server. Coba langsung.
Dua cara membuat pembayaran
Di browser: teruskan kunci publik (qvard_pk_...) dan nominal ke widget; ia membuat pembayaran dan membuka jendela. Di server: backend Anda membuat pembayaran via POST /api/v1/payment dan meneruskan id pembayaran ke widget. Untuk pesanan dengan harga tetap atau batas inventori, gunakan pembuatan server agar nominal tidak bisa diubah di browser. Atau lewati widget dan arahkan pelanggan ke halaman pembayaran hosted.
<script src="https://qvard.com/checkout.js"></script>
new QvardCheckout({
mode: 'modal',
publishableKey: 'qvard_pk_…',
price: 10,
onSuccess: function (e) {
console.log('paid', e.paymentId);
}
}).open();Di server: buat pembayaran terlebih dahulu
Server Anda mengirim id pesanan dan harga dalam USD dengan header x-api-key. Respons mengembalikan id pembayaran dan redirectUrl. Teruskan id ke widget di browser, atau gunakan redirectUrl untuk redirect hosted. Jaga kunci di server, karena permintaan tidak boleh dibuat dari browser.
x-api-key: qvard_sk_…
{
"id": "order_1024",
"price": 149.99,
"paymentSystemId": 12
}
// 201 Created
{
"data": {
"id": "8f3k2a1c",
"redirectUrl": "https://my.qvard.com/pay/8f3k2a1c"
},
"code": 201,
"message": "success",
"status": true
}Verifikasi pembayaran dari webhook
Saat status paid, webhook Anda menerima id dan status, ditandatangani dengan header X-Qvard-Signature (HMAC-SHA256). Verifikasi tanda tangan dengan kunci rahasia Anda (qvard_sk_...) dan pastikan nominal cocok dengan pesanan Anda. Tandai pesanan sebagai dibayar hanya setelah verifikasi tanda tangan.
Kapan menggunakan jendela tertanam
Gunakan jendela modal atau tertanam untuk menjaga pelanggan di halaman Anda. Halaman hosted dengan redirect juga bekerja sama baiknya dan menjadi pilihan jika Anda lebih suka tidak menyematkan jendela pembayaran. Kedua pendekatan menggunakan alur pembuatan pembayaran dan webhook yang sama.
FAQ
Apakah checkout kripto tertanam tersedia di Qvard hari ini?
Ya. Muat widget dari https://qvard.com/checkout.js dan teruskan kunci publik Anda (qvard_pk_...) untuk membuat di browser, atau buat pembayaran di server dan teruskan id.
Bagaimana cara menambahkan widget ke situs saya?
Sertakan tag <script src="https://qvard.com/checkout.js"></script> dan instansiasi QvardCheckout dengan kunci, nominal, dan mode Anda (modal atau inline). Lihat contoh kode di artikel ini dan demo.
Apakah tanda tangan pembayaran penting?
Ya. Selalu verifikasi header X-Qvard-Signature di webhook Anda dengan kunci rahasia, dan pastikan nominal di webhook cocok dengan pesanan Anda.
Bisakah saya menggunakan redirect alih-alih jendela tertanam?
Ya. Halaman pembayaran hosted di redirectUrl juga bekerja dengan baik dan tidak memerlukan widget. Kedua pendekatan menggunakan API dan webhook yang sama.
