One-time payments with CheckoutClient-only integration
Learn how to accept one-time card payments with just a few lines of code.
With the client-only integration, you define your products directly in the Stripe Dashboard and reference them by ID on the client side. This approach makes it possible to integrate Checkout into your website without any server-side code.
Warning
Client-only Checkout doesn’t support many of the features available with a client and server integration and Payment Links, which might better fit your use case.
Enable CheckoutDashboard
To begin using Checkout, log into the Stripe Dashboard and navigate to the Checkout settings. From here you can enable the client-only integration and customize the look and feel of your checkout page.
Create products and prices
To use Checkout, you first need to create a Product and a Price. Different physical goods or levels of service should be represented by products. Each product’s pricing is represented by one or more prices.
For example, you can create a T-shirt product that has 2 prices for different currencies: 20 USD and 15 EUR. This allows you to change and add prices without needing to change the details of your underlying products. You can either create a product and price through the API or through the Stripe Dashboard.
Caution
If you have an existing Checkout integration that doesn’t use Prices, note that the Checkout API has changed since Prices was introduced. You can use this migration guide to upgrade, or keep your existing integration.
Redirect to CheckoutDashboardClient-side
To use Checkout on your website, you must add a snippet of code that includes the desired price. You can use the Dashboard to generate the necessary code, or you can write it yourself.
Caution
Don’t rely on the redirect to the success_
alone for detecting payment initiation, as:
- Malicious users could directly access the
success_
without paying and gain access to your goods or services.url - Customers may not always reach the
success_
after a successful payment—they might close their browser tab before the redirect occurs.url
Confirm the payment is successful
When your customer completes a payment, they’re redirected to the URL that you specified as the success_
. This is typically a page on your website that informs your customer that their payment was successful.
Use the Dashboard, a custom webhook, or a third-party plugin to handle post-payment events like sending an order confirmation email to your customer, logging the sale in a database, or starting a shipping workflow.
You can use plugins like Zapier to automate updating your purchase fulfillment systems with information from Stripe payments.
Some examples of automation supported by plugins include:
- Updating spreadsheets used for order tracking in response to successful payments
- Updating inventory management systems in response to successful payments
- Triggering notifications to internal customer service teams using email or chat applications
Test the integration
There are several test cards you can use to make sure your integration is ready for production. Use them with any CVC, postal code, and future expiration date.
Number | Description |
---|---|
Succeeds and immediately processes the payment. | |
3D Secure 2 authentication must be completed for a successful payment. | |
Always fails with a decline code of insufficient_ . |
For the full list of test cards see our guide on testing.
Apple Pay and Google Pay
No configuration or integration changes are required to enable Apple Pay or Google Pay in Stripe Checkout. These payments are handled the same way as other card payments.