Terima pembayaran
Buat formulir pembayaran atau gunakan halaman checkout yang telah dibuat sebelumnya untuk mulai menerima pembayaran online.
Sematkan formulir pembayaran siap-rakit pada situs Anda menggunakan Stripe Checkout. Lihat cara membandingkan integrasi ini dengan tipe integrasi Stripe lainnya.
Upaya integrasi
Tipe integrasi
Sematkan formulir pembayaran siap-rakit di situs Anda
Penyesuaian UI
Gunakan pengaturan branding di Dashboard Stripe untuk mencocokkan Checkout dengan desain situs Anda.
Siapkan StripeSisi server
Pertama, mendaftarlah untuk akun Stripe.
Gunakan pustaka resmi kami untuk mengakses API Stripe dari aplikasi Anda:
Buat Sesi CheckoutSisi server
Dari server Anda, buat Sesi Checkout dan atur ui_mode ke embedded
. Anda dapat melakukan konfigurasi Sesi Checkout dengan mata anggaran untuk disertakan dan opsi seperti mata uang.
Untuk mengembalikan pelanggan ke halaman custom yang Anda hosting di situs web, tentukan URL halaman tersebut di parameter return_url. Sertakan variabel templat {CHECKOUT_SESSION_ID}
di URL untuk mengambil status sesi di halaman pengembalian. Checkout secara otomatis menggantikan variabel dengan identifikasi Sesi Checkout sebelum pengalihan.
Baca selengkapnya tentang mengonfigurasi halaman pengembalian dan opsi lain untuk menyesuaikan perilaku pengalihan.
Setelah Anda membuat Sesi Checkout, gunakan client_secret
yang dikembalikan sebagai respons untuk memasang Checkout.
Pasang CheckoutSisi klien
Checkout renders in an iframe that securely sends payment information to Stripe over an HTTPS connection.
Kesalahan umum
Avoid placing Checkout within another iframe because some payment methods require redirecting to another page for payment confirmation.
Sesuaikan penampilan
Sesuaikan Checkout agar cocok dengan desain situs Anda dengan mengatur warna latar belakang, warna tombol, radius batas, dan font di pengaturan branding akun.
Secara default, Checkout ditampilkan tanpa padding atau margin eksternal. Kami merekomendasikan penggunaan elemen kontainer seperti div untuk menerapkan margin yang Anda inginkan (misalnya, 16 piksel pada semua sisi).
Tampilkan halaman pengembalian
Setelah pelanggan Anda mencoba melakukan pembayaran, Stripe mengalihkan mereka ke halaman pengembalian yang Anda hosting pada situs. Saat membuat Sesi Checkout, Anda menentukan URL halaman pengembalian di parameter return_url parameter. Baca selengkapnya tentang opsi lain untuk menyesuaikan perilaku pengalihan.
Ketika menampilkan halaman pengembalian Anda, ambil status Sesi Checkout menggunakan identifikasi Sesi Checkout di URL. Tangani hasilnya sesuai dengan status sesi sebagai berikut:
complete
: Pembayaran berhasil. Gunakan informasi dari Sesi Checkout untuk menampilkan halaman berhasil.open
: Pembayaran gagal atau dibatalkan. Pasang ulang Checkout agar pelanggan Anda dapat mencoba lagi.
const session = await fetch(`/session_status?session_id=${session_id}`) if (session.status == 'open') { // Remount embedded Checkout } else if (session.status == 'complete') { // Show success page // Optionally use session.payment_status or session.customer_email // to customize the success page }
Metode pembayaran berbasis pengalihan
Selama pembayaran, sejumlah metode pembayaran mengalihkan pelanggan ke halaman perantara, seperti halaman otorisasi bank. Saat mereka menyelesaikan halaman tersebut, Stripe mengalihkan mereka ke halaman pengembalian.
Pelajari selengkapnya tentang metode pembayaran berbasis pengalihan dan perilaku pengalihan.
Coba integrasi Anda
Untuk mencoba integrasi formulir pembayaran tersemat Anda:
- Buat Sesi Checkout tersemat dan pasang Checkout pada halaman Anda.
- Isilah detail pembayaran dengan metode dari tabel di bawah ini.
- Masukkan tanggal mendatang untuk tanggal kedaluwarsa kartu.
- Masukkan nomor 3 angka untuk CVC.
- Masukkan kode pos tagihan.
- Klik Bayar. Anda akan dialihkan ke
return_url
. - Masuk ke Dashboard dan cari pembayaran di halaman pembayaran. Jika pembayaran berhasil, Anda akan melihatnya dalam daftar tersebut.
- Klik pembayaran Anda untuk melihat detail selengkapnya, seperti ringkasan Checkout dengan informasi tagihan dan daftar barang yang dibeli. Anda dapat menggunakan informasi ini untuk memenuhi pesanan.
Pelajari selengkapnya tentang mencoba integrasi Anda.
Lihat Pengujian untuk mendapatkan informasi tambahan untuk menguji integrasi Anda.