#One-time payments with Stripe

Stripe is a payment service provider that accepts credit cards, digital wallets and many other payment methods.

In this guide, we'll see how to integrate their javascript SDK with Access and easily achieve one-time payments.

This guide requires both a front-end & a server-side environment. To grasp everything we'll talk about, we recommend you to first read our guide about forms inside Access & how to integrate & validate them on-the-fly.

The first step consists in configuring the Stripe API key within your integration of Access (see the Access configuration section if you have any trouble editing your configuration).

You'll also need to have created a form within your dashboard with a "Credit card" field.

As we previously discussed how to verify simple form fields in our forms integration guide, the payment field should not be harder to achieve.

Since SCA & PSD-2 came into play in 2019, Stripe now requires you to implement an intent logic before being able to charge a customer. To avoid having to create multiple products and prices in our dashboard, we chose to only implement Stripe Elements and let you implement the above logic on your own server architecture.

The first step to achieve a successful charge is to create a customer and attach a payment intent:

Once you have created your customer & retrieved your intent secret, you can now confirm the payment using stripe front-end SDK, inside your onFormSubmit event handler:

Yep, it was that simple.

Note: The field information inside event.fields.cardField is the raw data sent by Stripe Elements upon validating the card element. So if you need to create the charge on your server instead of using stripe.confirmCardPayment, you're free to do it as you'd do with a simple Stripe integration.

And this concludes our wonderful guide on how to create a payment with Stripe inside your paywall in 5 minutes tops ✨