Panduan migrasi Checkout
Versi lama Checkout menampilkan dialog modal kepada pelanggan yang mengumpulkan informasi kartu, dan mengembalikan token atau sumber ke situs web Anda. Sebaliknya, versi Checkout saat ini adalah halaman pembayaran cerdas yang dihosting oleh Stripe yang membuat pembayaran atau langganan. Ini mendukung Apple Pay, 3D Secure Dinamis, dan banyak fitur lainnya.
Versi Checkout saat ini memberikan lebih banyak fleksibilitas, dengan dukungan untuk item baris dinamis, Connect, menggunakan kembali Pelanggan yang sudah ada, dan fitur langganan lanjutan. Anda juga dapat menggunakan integrasi hanya-client jika Anda ingin lebih cepat memulai atau jika Anda memiliki katalog produk yang lebih sederhana.
Untuk bermigrasi dari versi terdahulu ke versi saat ini, ikuti panduan yang paling mendekati model bisnis Anda. Setiap panduan merekomendasikan jalur integrasi beserta kode contoh.
Skema biaya dan katalog produk dinamis
Jika Anda memiliki katalog produk yang besar atau memerlukan dukungan untuk item baris yang dibuat secara dinamis (seperti donasi atau pajak).
Jika Anda adalah penyedia SaaS yang menagih pengguna dan membutuhkan dukungan untuk fitur lanjutan.
Connect platforms and marketplaces
Jika Anda menjalankan situs belanja online yang menghubungkan penyedia jasa dengan pelanggan.
Menyimpan metode pembayaran untuk penggunaan di masa mendatang
Jika Anda menjalankan bisnis yang tidak men-charge pelanggan hingga layanan diberikan.
Katalog produk sederhana dengan skema biaya tetap
Jika Anda menjual beberapa produk dengan harga yang sebelumnya telah ditentukan.
Jika Anda adalah penyedia SaaS dengan paket langganan bulanan.
Saat mengikuti panduan migrasi yang relevan, Anda juga dapat mereferensikan tabel konversi untuk pemetaan parameter tertentu dan opsi konfigurasi antara dua versi Checkout.
Skema biaya dan katalog produk dinamis
Jika Anda menjual produk yang jumlah atau item barisnya ditentukan secara dinamis (misalnya, dengan katalog produk besar atau untuk donasi), lihat menerima pembayaran satu kali.
Anda mungkin telah menggunakan versi terdahulu Checkout untuk membuat token atau sumber pada client, dan meneruskannya ke server Anda untuk membuat charge. Versi saat ini integrasi server Checkout membalikkan alur ini. Anda membuat Sesi di server terlebih dahulu, meneruskan identifikasinya ke client Anda, mengarahkan ulang pelanggan ke Checkout, yang kemudian diarahkan ulang untuk kembali ke aplikasi Anda setelah berhasil.
Sebelum
Dengan versi terdahulu Checkout, Anda akan menampilkan jumlah dinamis dan keterangan serta mengumpulkan informasi kartu dari pelanggan Anda.
<form action="/purchase" method="POST"> <script src="https://checkout.stripe.com/checkout.js" class="stripe-button" data-key=
data-name="Custom t-shirt" data-description="Your custom designed t-shirt" data-amount="{{ORDER_AMOUNT}}" data-currency="usd"> </script> </form>"pk_test_TYooMQauvdEDq54NiTphI7jx"
Berikutnya, Anda akan mengirim token atau sumber yang dihasilkan ke server Anda dan melakukan charge.
Setelah
Dengan versi Checkout saat ini, buat Sesi Checkout terlebih dahulu di server Anda.
Catatan
Jika Anda menggunakan salah satu pustaka Client kami, lakukan upgrade ke versi terbaru pustaka untuk menggunakan Checkout Sessions API.
Berikutnya, teruskan identifikasi Sesi ke client dan arahkan ulang pelanggan Anda ke Checkout untuk menyelesaikan pembayaran.
const stripe = Stripe(
); const checkoutButton = document.getElementById('checkout-button'); checkoutButton.addEventListener('click', () => { stripe.redirectToCheckout({ // Make the id field from the Checkout Session creation API response // available to this file, so you can provide it as argument here // instead of the {{CHECKOUT_SESSION_ID}} placeholder. sessionId: '{{CHECKOUT_SESSION_ID}}' }) // If `redirectToCheckout` fails due to a browser or network // error, display the localized error message to your customer // using `error.message`. });'pk_test_TYooMQauvdEDq54NiTphI7jx'
Pelanggan diarahkan ulang ke success_url
begitu mereka menyelesaikan pembayaran.
Jika Anda perlu memenuhi barang yang dibeli setelah pembayaran, lihat Pemenuhan Pembelian Checkout.
Langganan dinamis
Jika Anda menyediakan layanan berlangganan yang ditentukan secara dinamis atau memerlukan dukungan untuk fitur lanjutan lainnya, lihat menyiapkan langganan.
Anda mungkin telah menggunakan versi terdahulu Checkout untuk membuat token atau sumber pada client, dan meneruskannya ke server Anda untuk membuat pelanggan dan langganan. Namun, versi integrasi server Checkout saat ini membalikkan alur ini. Anda membuat Sesi di server terlebih dahulu, meneruskan identifikasinya ke client, mengarahkan ulang pelanggan Anda ke Checkout, yang kemudian diarahkan ulang untuk kembali ke aplikasi Anda setelah berhasil.
Sebelum
Dengan versi terdahulu Checkout, Anda akan menampilkan informasi langganan dan mengumpulkan informasi kartu dari pelanggan Anda.
<form action="/subscribe" method="POST"> <script src="https://checkout.stripe.com/checkout.js" class="stripe-button" data-key=
data-name="Gold Tier" data-description="Monthly subscription with 30 days trial" data-amount="2000" data-label="Subscribe"> </script> </form>"pk_test_TYooMQauvdEDq54NiTphI7jx"
Berikutnya, Anda akan mengirim token atau sumber yang dihasilkan ke server Anda untuk membuat pelanggan dan langganan.
Setelah
Dengan versi Checkout saat ini, buat Sesi Checkout terlebih dahulu di server Anda.
Catatan
Jika Anda menggunakan salah satu pustaka Client kami, lakukan upgrade ke versi terbaru pustaka untuk menggunakan Checkout Sessions API.
Berikutnya, teruskan identifikasi Sesi ke client dan arahkan ulang pelanggan Anda ke Checkout untuk menyelesaikan pembayaran.
const stripe = Stripe(
); const checkoutButton = document.getElementById('checkout-button'); checkoutButton.addEventListener('click', () => { stripe.redirectToCheckout({ // Make the id field from the Checkout Session creation API response // available to this file, so you can provide it as argument here // instead of the {{CHECKOUT_SESSION_ID}} placeholder. sessionId: '{{CHECKOUT_SESSION_ID}}' }) // If `redirectToCheckout` fails due to a browser or network // error, display the localized error message to your customer // using `error.message`. });'pk_test_TYooMQauvdEDq54NiTphI7jx'
Pelanggan akan diarahkan ulang ke success_url
setelah pelanggan dan langganan dibuat.
Jika Anda perlu memenuhi jasa yang dibeli setelah pembayaran, lihat Pemenuhan Pembelian Checkout.
Anda juga dapat memperbarui informasi langganan menggunakan Checkout.
Situs belanja online dan platform Connect
Jika Anda menjalankan situs belanja online atau platform Connect serta melakukan pembayaran yang melibatkan akun terhubung, pertimbangkan menggunakan versi saat ini dari integrasi server Checkout. Ikuti instruksi dalam panduan Connect untuk memigrasi integrasi Anda.
Contoh berikut menunjukkan penggunaan Checkout Sessions API untuk memproses charge langsung. Ikuti panduan Connect untuk mengetahui detail tentang cara membuat charge tujuan.
Sebelum
Dengan versi terdahulu Checkout, Anda akan mengumpulkan informasi kartu dari pelanggan Anda pada client.
<form action="/purchase" method="POST"> <script src="https://checkout.stripe.com/checkout.js" class="stripe-button" data-key=
data-name="Food Marketplace" data-description="10 cucumbers from Roger's Farm" data-amount="2000"> </script> </form>"pk_test_TYooMQauvdEDq54NiTphI7jx"
Berikutnya, Anda akan mengirim token atau sumber yang dihasilkan ke server Anda dan melakukan charge atas nama akun terhubung.
Setelah
Dengan versi Checkout saat ini, buat Sesi Checkout terlebih dahulu di server Anda atas nama akun terhubung.
Catatan
Jika Anda menggunakan salah satu pustaka Client kami, lakukan upgrade ke versi terbaru pustaka untuk menggunakan Checkout Sessions API.
Berikutnya, teruskan identifikasi Sesi ke client dan arahkan ulang pelanggan Anda ke Checkout untuk menyelesaikan pembayaran. Pastikan untuk memberikan identifikasi akun terhubung ketika menginisialisasi Stripe.js.
// Initialize Stripe.js with the same connected account ID used when creating // the Checkout Session. const stripe = Stripe(
, { stripeAccount:'pk_test_TYooMQauvdEDq54NiTphI7jx'}); const checkoutButton = document.getElementById('checkout-button'); checkoutButton.addEventListener('click', () => { stripe.redirectToCheckout({ // Make the id field from the Checkout Session creation API response // available to this file, so you can provide it as argument here // instead of the {{CHECKOUT_SESSION_ID}} placeholder. sessionId: '{{CHECKOUT_SESSION_ID}}' }) // If `redirectToCheckout` fails due to a browser or network // error, display the localized error message to your customer // using `error.message`. });'{{CONNECTED_ACCOUNT_ID}}'
Pelanggan diarahkan ulang ke success_url
begitu mereka menyelesaikan pembayaran.
Jika Anda perlu memenuhi barang atau jasa yang dibeli setelah pembayaran, lihat Pemenuhan Pembelian Checkout.
Menyimpan metode pembayaran untuk penggunaan di masa mendatang
Jika Anda menyediakan layanan yang tidak segera men-charge pelanggan, lihat menyiapkan pembayaran mendatang.
Anda mungkin telah menggunakan versi terdahulu Checkout untuk membuat token atau sumber pada client, dan meneruskannya ke server Anda untuk membuat charge. Versi saat ini dari integrasi server Checkout membalikkan alur ini. Anda membuat Sesi di server terlebih dahulu, meneruskan identifikasinya ke client Anda, mengarahkan ulang pelanggan ke Checkout, yang kemudian diarahkan ulang untuk kembali ke aplikasi Anda setelah berhasil.
Sebelum
Dengan versi terdahulu Checkout, Anda akan menampilkan informasi charge dan mengumpulkan informasi kartu dari pelanggan Anda.
<form action="/subscribe" method="POST"> <script src="https://checkout.stripe.com/checkout.js" class="stripe-button" data-key=
data-name="Cleaning Service" data-description="Charged after your home is spotless" data-amount="2000"> </script> </form>"pk_test_TYooMQauvdEDq54NiTphI7jx"
Berikutnya, Anda akan mengirim token atau sumber yang dihasilkan ke server Anda untuk membuat charge nantinya.
Setelah
Dengan versi Checkout saat ini, buat Sesi Checkout di server Anda terlebih dahulu menggunakan mode persiapan.
Catatan
Jika Anda menggunakan salah satu pustaka Client kami, lakukan upgrade ke versi terbaru pustaka untuk menggunakan Checkout Sessions API.
Berikutnya, teruskan identifikasi Sesi ke client dan arahkan ulang pelanggan Anda ke Checkout untuk mengumpulkan detail metode pembayaran.
const stripe = Stripe(
); const checkoutButton = document.getElementById('checkout-button'); checkoutButton.addEventListener('click', () => { stripe.redirectToCheckout({ // Make the id field from the Checkout Session creation API response // available to this file, so you can provide it as argument here // instead of the {{CHECKOUT_SESSION_ID}} placeholder. sessionId: '{{CHECKOUT_SESSION_ID}}' }) // If `redirectToCheckout` fails due to a browser or network // error, display the localized error message to your customer // using `error.message`. });'pk_test_TYooMQauvdEDq54NiTphI7jx'
Pelanggan diarahkan ulang ke success_url
begitu mereka menyelesaikan alur.
Dari sana, Anda dapat mengambil Setup Intent dari alur Checkout dan menggunakannya untuk mempersiapkan transaksi Anda.
Katalog produk sederhana dengan skema biaya tetap
Jika Anda menjual produk dengan skema biaya tetap (seperti baju kaus atau e-book), lihat panduan tentang pembayaran satu kali untuk mempelajari cara membuat snippet kode untuk ditambahkan ke situs web Anda.
Anda mungkin telah menggunakan versi terdahulu Checkout untuk membuat token atau sumber pada client, dan meneruskannya ke server Anda untuk membuat charge. Versi saat ini dari Checkout melakukan pembayaran secara otomatis untuk Anda, dan integrasi server tidak diperlukan.
Kode sisi client
Kode sisi server
Tabel konversi di bawah ini memberikan pemetaan opsi konfigurasi antara dua versi Checkout. Untuk daftar lengkap opsi konfigurasi untuk versi saat ini, lihat referensi redirectToCheckout
.
Langganan sederhana
Jika Anda menyediakan layanan langganan sederhana (seperti akses bulanan ke perangkat lunak), lihat panduan tentang langganan untuk mempelajari cara membuat paket di Dashboard dan membuat cuplikan kode untuk ditambahkan ke situs web Anda.
Anda mungkin telah menggunakan versi terdahulu Checkout untuk membuat token atau sumber pada client, dan meneruskannya ke server Anda untuk membuat pelanggan dan langganan. Namun, versi Checkout saat ini membuat pelanggan dan langganan secara otomatis untuk Anda, serta integrasi server tidak diperlukan.
Kode sisi client
Kode sisi server
Tabel konversi di bawah ini memberikan pemetaan opsi konfigurasi antara dua versi Checkout. Untuk daftar lengkap opsi konfigurasi untuk versi saat ini, lihat referensi redirectToCheckout
.
Konversi parameter
Versi Checkout saat ini mendukung sebagian besar fungsionalitas dari versi terdahulu Checkout. Namun, kedua versi tersebut tidak berbagi API yang sama. Tabel di bawah ini memetakan parameter dan opsi konfigurasi antara versi terdahulu dan versi saat ini.
Untuk daftar lengkap opsi konfigurasi yang diterima oleh versi Checkout saat ini, lihat referensi Stripe.js dan referensi API untuk Sesi Checkout.
Versi terdahulu | Versi saat ini | Kiat integrasi |
---|---|---|
allowRememberMe |
| Versi Checkout saat ini tidak mendukung Remember Me. Untuk menggunakan kembali pelanggan yang sudah ada, kami merekomendasikan penentuan parameter customer ketika membuat Sesi Checkout. |
amount |
| Jumlah total adalah penjumlahan item baris yang Anda teruskan ke Checkout. |
billingAddress |
| Checkout mengumpulkan alamat tagihan secara otomatis bila diperlukan untuk pencegahan penipuan atau tujuan regulasi. Atur parameter ini ke required untuk selalu mengumpulkan alamat tagihan. |
billingAddress |
| Checkout mengumpulkan alamat tagihan secara otomatis bila diperlukan untuk pencegahan penipuan atau tujuan regulasi. Atur parameter ini ke required untuk selalu mengumpulkan alamat tagihan. |
closed |
| Bila pelanggan ingin menutup Checkout, mereka bisa menutup tab browser atau masuk ke cancelUrl . |
currency |
| |
description |
| Jika Anda menentukan harga, Checkout menampilkan keterangan yang dihitung secara otomatis mengenai seberapa sering pembayaran terjadi. Jika Anda menentukan Session.line_items , Checkout menampilkan name untuk setiap item baris. |
email |
| Jika Anda sudah mengetahui email pelanggan, tentukan di sini agar mereka tidak perlu memasukkannya lagi. |
image |
| Checkout menggunakan gambar tertentu untuk branding bisnis dan untuk produk yang Anda jual. Checkout menampilkan logo bisnis Anda secara default dan kembali ke ikon bisnis bersama nama bisnis Anda. |
key |
| |
locale |
| Anda dapat menentukan lokal yang didukung ketika membuat Sesi Checkout. |
name |
| Jika Anda menentukan harga, Checkout menampilkan nama produk yang memakai harga itu. Jika Anda menentukan Session.line_items , Checkout menampilkan name untuk setiap item baris. |
panelLabel |
| Checkout menyesuaikan teks tombol secara otomatis bergantung pada item yang Anda jual. Untuk pembayaran satu kali, gunakan submit_type untuk menyesuaikan teks tombol. |
shippingAddress |
| Kumpulkan informasi alamat pengiriman dengan meneruskan larik allowed_countries negara tujuan yang ingin Anda izinkan. |
token atau source |
| Tidak ada lagi panggilan balik di JavaScript bila pembayaran selesai. Karena pelanggan Anda membayar di halaman yang berbeda, atur successUrl untuk mengarahkan ulang pelanggan Anda setelah mereka menyelesaikan pembayaran. |
zipCode |
| Checkout mengumpulkan kode pos secara otomatis bila diperlukan untuk pencegahan penipuan atau tujuan regulasi. |