Cara Menambahkan Pembayaran ke Aplikasi: Checkout, Langganan, dan Webhook

Cara termudah menambahkan pembayaran ke aplikasi kamu adalah Stripe: gunakan Payment Link jika kamu hanya butuh tombol "Beli" dan bisa mengurus pesanan secara manual; Stripe Checkout jika aplikasi kamu perlu tahu siapa yang membayar dan bereaksi secara otomatis; dan Checkout dalam mode langganan plus portal pelanggan Stripe untuk tagihan berulang. Di setiap kasus selain yang paling sederhana, kamu juga memerlukan webhook — endpoint server yang dipanggil Stripe saat pembayaran berhasil — dan kamu sebaiknya menguji semuanya dengan key uji dan kartu uji Stripe sebelum beralih ke key live.

Panduan ini menjelaskan setiap pilihan, bagian webhook yang sering dilewatkan oleh tutorial, dan hal-hal yang perlu diperiksa sebelum menerima uang sungguhan. Detail Stripe berasal dari dokumentasi Stripe sendiri per September 2026.

Mengapa menggunakan penyedia pembayaran

Jangan pernah mengumpulkan nomor kartu di formulir kamu sendiri. Menangani data kartu mentah membuatmu masuk ke cakupan PCI DSS (standar keamanan industri kartu) dan merupakan risiko besar. Penyedia pembayaran seperti Stripe menghosting formulir pembayaran, menyimpan kartu, menangani autentikasi bank, dan memberi tahu aplikasi kamu hasilnya. Aplikasi kamu hanya melihat "pelanggan X membayar Y".

Panduan ini memakai Stripe karena banyak dipakai, terdokumentasi dengan baik, dan didukung oleh sebagian besar AI app builder. Ada penyedia lain, dan sebagian bertindak sebagai "merchant of record" yang menangani pajak penjualan untukmu; jika kepatuhan pajak menjadi kekhawatiran, model itu layak dibandingkan.

Tiga cara menerima pembayaran dengan Stripe

Payment Link

Payment Link adalah halaman pembayaran yang dihosting Stripe, yang kamu buat di Dashboard Stripe tanpa kode. Kamu mendapat URL yang bisa kamu pasang di balik tombol di aplikasi kamu, bagikan lewat email, atau tampilkan sebagai kode QR. Dokumentasi Stripe menyatakan Payment Link bisa menjual produk, langganan, atau menerima donasi, dan kamu bisa membiarkan pelanggan memilih apa yang dibayar atau membatasi jumlah pembelian.

Kekurangannya: aplikasi kamu tidak otomatis tahu bahwa pengguna tertentu yang sudah login telah membayar. Untuk halaman donasi atau toko kecil tempat kamu memenuhi pesanan secara manual dari notifikasi email Stripe, itu tidak masalah. Untuk "bayar untuk membuka fitur Pro", itu tidak cukup.

Stripe Checkout

Checkout adalah halaman pembayaran yang dibuat server kamu saat dibutuhkan untuk pembelian tertentu. Server kamu memberi tahu Stripe apa yang dibeli (dan opsional siapa pembelinya), Stripe mengembalikan URL, dan kamu mengirim pelanggan ke sana. Dokumentasi Stripe menjelaskan bahwa Checkout mendukung pembayaran sekali maupun langganan, sebagai halaman penuh yang dihosting Stripe, halaman yang disematkan di situsmu, atau formulir tertanam.

Alurnya:

1. Pelanggan mengklik Beli di aplikasi kamu.
2. Server kamu membuat Checkout Session menggunakan secret key kamu, termasuk ID yang menautkannya ke pengguna atau pesanan kamu.
3. Pelanggan dialihkan ke Stripe dan membayar.
4. Stripe mengalihkan mereka kembali ke halaman sukses kamu.
5. Stripe mengirim event checkout.session.completed ke webhook kamu, dan server kamu menandai pesanan lunas atau membuka akses.

Langkah 2 harus terjadi di server, karena menggunakan secret key kamu. Itulah alasan utama Checkout membutuhkan backend.

Langganan

Langganan menggunakan Checkout dalam mode langganan dengan harga berulang yang kamu atur di Stripe. Pembayaran pertama bekerja seperti alur di atas. Setelah itu, perpanjangan, kartu yang gagal, peningkatan di tengah siklus, dan pembatalan terjadi seiring waktu — sering kali ketika pelanggan sudah tidak berada di aplikasi kamu — sehingga aplikasi kamu hanya mengetahuinya lewat webhook.

Untuk membiarkan pelanggan mengelola langganan mereka sendiri, Stripe menawarkan portal pelanggan yang dihosting. Menurut dokumentasi Stripe, pelanggan dapat memperbarui metode pembayaran dan detail tagihan, mengubah atau membatalkan langganan, serta melihat dan mengunduh invoice di sana. Kamu mengonfigurasinya di Dashboard Stripe dan menambahkan tombol "Kelola tagihan" yang mengirim pelanggan ke sana. Ini menghemat waktu karena kamu tidak perlu membangun layar-layar itu sendiri.

Webhook: bagian yang tidak boleh dilewati

Webhook adalah permintaan HTTP yang dikirim Stripe ke server kamu saat sesuatu terjadi. (Lihat apa itu webhook untuk ide umumnya.) Panduan pemenuhan Stripe menegaskan: kamu tidak bisa hanya mengandalkan halaman sukses untuk memenuhi pesanan, karena pelanggan bisa membayar lalu kehilangan koneksi sebelum halaman itu dimuat. Untuk langganan dan metode pembayaran tertunda, webhook wajib.

Event yang perlu ditangani

Aturan untuk handler webhook yang benar

Ini langsung dari dokumentasi webhook Stripe, dan handler yang dibuat AI kadang melewatkan salah satunya:

• Verifikasi tanda tangan. Setiap event menyertakan header Stripe-Signature. Handler kamu memeriksanya menggunakan signing secret endpoint (diawali whsec_). Tanpa ini, siapa pun bisa mengirim "pembayaran berhasil" palsu ke server kamu.
• Gunakan body permintaan mentah. Pemeriksaan tanda tangan gagal jika framework kamu mengurai atau mengubah body terlebih dahulu.
• Kembalikan respons 2xx dengan cepat, lalu kerjakan tugas yang lebih lambat. Timeout dihitung sebagai kegagalan.
• Tangani duplikat. Stripe mungkin mengirim event yang sama lebih dari sekali. Catat ID event yang sudah diproses, atau buat pemenuhan aman jika dijalankan dua kali.
• Jangan berasumsi urutan. Stripe tidak menjamin event tiba sesuai urutan kejadiannya.
• Bersiap untuk percobaan ulang. Dalam mode live, Stripe mencoba ulang pengiriman yang gagal hingga tiga hari, jadi gangguan singkat tidak menghilangkan pembayaran — tetapi handler kamu harus bisa menangani event yang terlambat.

Webhook membutuhkan alamat HTTPS publik, jadi biasanya hanya berfungsi setelah aplikasi kamu dipublikasikan (CLI Stripe dapat meneruskan event ke mesin lokal untuk pengembang).

Satu prompt yang mencakup seluruh alur

Tambahkan pembelian sekali bayar dengan Stripe Checkout untuk "Pro pack" (ID harga di STRIPE_PRICE_ID). Buat Checkout Session di server menggunakan STRIPE_SECRET_KEY dari secret, dan sertakan ID pengguna yang sedang login di session. Tambahkan endpoint POST /api/stripe/webhook yang memverifikasi tanda tangan Stripe dengan STRIPE_WEBHOOK_SECRET menggunakan body permintaan mentah, menangani checkout.session.completed, dan menandai pengguna itu sebagai memiliki Pro pack. Pastikan aman jika event yang sama tiba dua kali. Tambahkan halaman sukses dan batal. Jangan pernah menampilkan secret key ke browser.

Untuk langganan, tambahkan: "Gunakan mode langganan dengan STRIPE_PRICE_ID. Tangani invoice.paid, invoice.payment_failed, customer.subscription.updated, dan customer.subscription.deleted. Tambahkan tombol Kelola tagihan yang membuka portal pelanggan Stripe."

Mode uji

Stripe memiliki lingkungan sandbox (uji) dan live terpisah dengan key yang berbeda. Key sandbox diawali pk_test_, sk_test_, atau rk_test_; key live diawali pk_live_, sk_live_, atau rk_live_. Transaksi uji tidak memindahkan uang.

Kartu uji yang berguna dari dokumentasi pengujian Stripe (tanggal kedaluwarsa di masa depan apa pun, CVC tiga digit apa pun):

Uji setidaknya:

• Pembayaran yang berhasil membuka hal yang tepat untuk pengguna yang tepat
• Kartu yang ditolak menampilkan pesan yang jelas dan tidak membuka apa pun
• Menutup tab browser tepat setelah membayar tetap memberikan akses (ini membuktikan webhook bekerja, bukan hanya halaman sukses)
• Membatalkan di halaman Stripe mengembalikan pengguna ke aplikasi kamu tanpa ada tagihan
• Untuk langganan: batalkan di portal pelanggan dan pastikan akses berakhir pada waktunya

Go live

1. Aktifkan akun Stripe kamu dengan detail bisnis dan rekening bank.
2. Ganti dengan key live di secret aplikasi kamu. Stripe merekomendasikan restricted key dengan hanya izin yang dibutuhkan integrasi kamu, bukan secret key tanpa batasan.
3. Buat endpoint webhook live yang mengarah ke aplikasi kamu yang sudah dipublikasikan. Endpoint ini punya signing secret sendiri, berbeda dari yang uji — perbarui.
4. Buat ulang produk dan harga dalam mode live; ID dari mode uji tidak ada di sana.
5. Lakukan satu pembelian kecil yang sungguhan dan refund.

Simpan setiap key di secret proyek kamu, jangan pernah di kode atau chat. Checklist keamanan kami membahas key dan verifikasi webhook lebih detail.

Pajak, refund, dan administrasi

Pembayaran membawa kewajiban yang tidak bisa diselesaikan oleh kode. Ini bukan nasihat pajak; konsultasikan dengan akuntan.

• Pajak penjualan, PPN, dan GST. Tergantung di mana kamu dan pelangganmu berada, kamu mungkin perlu mendaftar, memungut, dan melaporkan pajak. Stripe Tax dapat menghitung dan memungut pajak saat checkout, memantau di mana penjualanmu mungkin menimbulkan kewajiban, dan membantu pendaftaran serta pelaporan — tetapi tanggung jawab tetap padamu. Penyedia merchant-of-record adalah alternatif yang mengambil lebih banyak bagian ini.
• Refund dan sengketa. Tentukan kebijakan refund sebelum peluncuran dan tampilkan di situsmu. Sengketa (chargeback) terjadi; simpan catatan tentang apa yang dibeli dan dikirim.
• Kuitansi dan invoice. Stripe bisa mengirim kuitansi lewat email; bisnis mungkin membutuhkan invoice yang layak.
• Biaya. Setiap penyedia mengenakan biaya per transaksi. Periksa halaman harga terkini penyedia daripada mengandalkan angka di artikel.

Pengaturan mana yang cocok untuk aplikasimu

• Donasi atau beberapa produk saja: Payment Link. Lihat cara membangun situs donasi nirlaba.
• Toko dengan keranjang belanja: Checkout dengan line item dan webhook. Lihat cara membangun toko online.
• SaaS atau keanggotaan: Checkout dalam mode langganan, webhook, dan portal pelanggan. Lihat cara membangun MVP SaaS dan cara menetapkan harga produk SaaS.
• Marketplace yang membayar penjual: pengaturan yang berbeda dan lebih diatur (Stripe Connect atau sejenisnya). Rencanakan secara terpisah.

Menambahkan pembayaran di Mythex

Pembayaran di aplikasi yang kamu buat di Mythex menggunakan akun Stripe dan key milikmu sendiri; tidak ada koneksi Stripe satu klik untuk aplikasi kamu. Alurnya biasanya:

1. Dapatkan key uji Stripe.
2. Tambahkan STRIPE_SECRET_KEY (dan webhook secret nanti) ke secret proyek — lewat /secrets, pengaturan proyek, atau kartu secret yang ditampilkan agent saat membutuhkan key.
3. Minta agent untuk Checkout dengan prompt seperti di atas.
4. Uji di Preview dengan kartu uji. Publikasikan sebelum mendaftarkan webhook, karena webhook membutuhkan URL publikmu.
5. Setelah beralih ke key live, publikasikan lagi agar aplikasi live memakai key tersebut.

Lihat Terima pembayaran dengan Stripe dan Tangani webhook di backend kamu di dokumentasi.

Pertanyaan