API Connector and Stripe Elements

Hi, everyone:

I have been convinced to use API Connector to interact with Stripe rather than Stripe.js 2. I also want to customize my own checkout page with Stripe Elements rather than Stripe’s prebuilt checkout. However, when I read Stripe Docs, it says Stripe Elements is a feature of Stripe.js. So does that mean that if I want to use Stripe Elements in my Bubble app, I have to use Stripe.js 2 anyway?

Thank you.

1 Like

You are mixing different things.
Stripe Checkout is the checkout page hosted by Stripe. To use it you only need to create a checkout session with a request to the API and redirect the user to the returned url. The checkout page can have some style adjustement, and custom domain, that are handled from the Stripe dashboard. No javascript code required, the API connector is all you need.

Stripe Elements lets you embed a payment form in your app. You still need to call the stripe API for sessing up the payment you want, but instead of redirecting the user to the checkout page you embed the payment form. Everything is still handled by Stripe but you have more control over the styling of the form, and of course you decide where to display it in your page. Of course all this requires to load a javascript library from Stripe and set everything up with some code. You can do everything else with the API connector (that is much more flexible and powerful) and use stripe.js for the stripe elements only.

I hope it’s more clear now.


You might want to use API Connector to customize your UX/UI. Stripe Checkout only offers limited features but good enough for most use cases.