Terima pembayaran
Buat formulir pembayaran atau gunakan halaman checkout yang telah dibuat sebelumnya untuk mulai menerima pembayaran online.
Alihkan ke halaman pembayaran yang di-hosting Stripe menggunakan Stripe Checkout. Lihat cara membandingkan integrasi ini dengan tipe integrasi Stripe lainnya.
Upaya integrasi
Tipe integrasi
Alihkan ke halaman pembayaran yang di-hosting Stripe
Penyesuaian UI
Siapkan StripeSisi server
Pertama, mendaftarlah untuk akun Stripe.
Gunakan pustaka resmi kami untuk mengakses API Stripe dari aplikasi Anda:
Alihkan pelanggan Anda ke Stripe CheckoutSisi clientSisi server
Tambahkan tombol checkout ke situs web Anda yang memanggil endpoint sisi server untuk membuat Sesi Checkout.
<html> <head> <title>Buy cool new product</title> </head> <body> <!-- Use action="/create-checkout-session.php" if your server is PHP based. --> <form action="/create-checkout-session" method="POST"> <button type="submit">Checkout</button> </form> </body> </html>
Sesi Checkout adalah representasi terprogram dari apa yang dilihat pelanggan Anda saat mereka dialihkan ke formulir pembayaran. Anda dapat mengonfigurasinya dengan opsi seperti:
- Mata anggaran untuk di-charge
- Mata uang untuk digunakan
Anda juga harus menentukan success_url
, halaman di situs web tempat Checkout mengembalikan pelanggan Anda setelah mereka menyelesaikan pembayaran. Secara opsional, Anda dapat memberikan cancel_url
, halaman di situs web Anda tempat Checkout mengembalikan pelanggan Anda jika mereka membatalkan proses pembayaran.
Catatan
Sesi Checkout akan kedaluwarsa dalam waktu 24 jam setelah pembuatan.
Setelah membuat Sesi Checkout, alihkan pelanggan ke URL yang dikembalikan di respons.
Catatan
Secara default, Stripe mengaktifkan kartu dan metode pembayaran umum lainnya yang dapat membantu menjangkau lebih banyak pelanggan, dan Anda dapat mengaktifkan atau menonaktifkan metode pembayaran langsung dari Dashboard Stripe. Stripe mengevaluasi mata uang, pembatasan metode pembayaran, dan parameter lainnya guna menentukan daftar metode pembayaran yang didukung untuk ditampilkan di Checkout.
Coba endpoint Anda dengan memulai server web (misalnya, localhost:4242
) dan menjalankan perintah berikut:
curl -X POST -is "http://localhost:4242/create-checkout-session" -d ""
Anda akan melihat respons di terminal seperti ini:
HTTP/1.1 303 See Other Location: https://checkout.stripe.com/c/pay/cs_test_... ...
Mencoba
Anda sekarang telah memiliki tombol checkout yang mengalihkan pelanggan ke Stripe Checkout.
- Klik tombol checkout.
- Anda akan dialihkan ke formulir pembayaran Stripe Checkout.
Jika integrasi Anda tidak berhasil:
- Buka tab Network di alat pengembang browser Anda.
- Klik tombol checkout dan konfirmasikan dengan mengirim permintaan XHR ke endpoint sisi server Anda (
POST /create-checkout-session
). - Verifikasikan bahwa permintaan mengembalikan status 200.
- Gunakan
console.log(session)
di dalam listener klik tombol Anda untuk mengonfirmasi bahwa data yang benar dikembalikan.
Untuk melihat cara metode pembayaran Anda ditampilkan kepada pelanggan, masukkan identifikasi transaksi atau tetapkan jumlah pesanan dan mata uang di Dashboard.
Tampilkan halaman berhasilSisi clientSisi server
Pelanggan Anda perlu melihat halaman berhasil setelah mereka berhasil menyerahkan formulir pembayaran. Hosting halaman berhasil ini di situs Anda.
Buat halaman berhasil minimal:
<html> <head><title>Thanks for your order!</title></head> <body> <h1>Thanks for your order!</h1> <p> We appreciate your business! If you have any questions, please email <a href="mailto:orders@example.com">orders@example.com</a>. </p> </body> </html>
Berikutnya, perbarui endpoint pembuatan Sesi Checkout untuk menggunakan halaman baru ini:
Catatan
Jika Anda ingin menyesuaikan halaman berhasil, baca panduan halaman berhasil custom.
Mencoba
- Klik tombol checkout Anda.
- Isikan detail pembayaran dengan informasi kartu percobaan:
- Masukkan
4242 4242 4242 4242
sebagai nomor kartu. - Masukkan tanggal mendatang untuk tanggal kedaluwarsa kartu.
- Masukkan nomor 3 angka untuk CVC.
- Masukkan kode pos tagihan.
- Masukkan
- Klik Bayar.
- Anda akan dialihkan ke halaman berhasil yang baru.
Berikutnya, temukan pembayaran baru di Dashboard Stripe. Pembayaran yang berhasil akan muncul dalam daftar pembayaran Dashboard. Saat mengeklik pembayaran, Anda akan dibawa ke halaman detail pembayaran. Bagian Ringkasan checkout berisi informasi penagihan dan daftar item yang dibeli, yang dapat Anda gunakan untuk memenuhi pesanan secara manual.
Coba integrasi Anda
Untuk mencoba integrasi formulir pembayaran yang di-hosting Stripe Anda:
- Buat Sesi Checkout.
- Isilah detail pembayaran dengan metode dari tabel berikut.
- Masukkan tanggal mendatang untuk tanggal kedaluwarsa kartu.
- Masukkan nomor 3 angka untuk CVC.
- Masukkan kode pos tagihan.
- Klik Bayar. Anda akan dialihkan ke
success_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.
Kartu percobaan
Nomor | Keterangan |
---|---|
Berhasil dan segera memproses pembayaran. | |
Memerlukan autentikasi 3D Secure 2 agar pembayaran berhasil. | |
Selalu gagal dengan kode tolakan insufficient_funds . |
Apple Pay dan Google Pay
Anda dapat mengaktifkan Apple Pay dan Google Pay di pengaturan metode pembayaran. Apple Pay diaktifkan secara default.
Halaman Checkout yang di-hosting tidak perlu perubahan integrasi untuk mengaktifkan Apple Pay atau Google Pay. Stripe menangani pembayaran ini dengan cara yang sama seperti pembayaran kartu lainnya.
Kini setelah integrasi dasar Anda berjalan, ketahui cara memperoleh notifikasi secara terprogram kapan saja pelanggan membayar.