Configure a Stripe Checkout Domain for Client-Only Integration

Colby Fayock
InstructorColby Fayock
Share this video with your friends

Social Share Links

Send Tweet
Published 3 years ago
Updated 3 years ago

Stripe has a variety of solutions that makes it super powerful as a payment provider. We're taking advantage of their Stripe Checkout product because it allows us to get started with an online store without having to manually accept payments.

To do this though, Stripe Checkout relies on the browser to make API requests, which we have to configure to work for our website.

We will set our eCommerce site domain on Stripe's CLIENT-ONLY integration to set us up to add the checkout workflow for our site.

Instructor: [0:00] We're going to start off with our Space Jelly Shop deployed to Vercel. When we begin to accept payments for our site, we're going to use Stripe Checkout. Because this integration is client-side, we're going to need to make a few configurations in our Stripe account to make it work.

[0:11] Once we're logged in and inside of our stripe.com Dashboard, we're going to navigate over to the Settings in the left-side bar. Under the Payment sections, we're going to select Checkout settings. Once there, we want to scroll to the bottom, where we see the information about client-only integration.

[0:25] Here, we want to click the button that says Enable Client-only integration. Once you get done reading through this modal, we can click Allow. Once our client-only integration is enabled, we're going to see a new field that says Domains. If we go back to our Vercel deployed Space Jelly Shop, we can see that our domain is going to be myecomstore.vercel.app.

[0:43] Inside this field, I'm going to paste in my URL, and I'm going to click Save. What that will do is set our domain as a valid URL. That way, we can run our client-side code on it. Otherwise, for security purposes, Stripe won't allow an integration on another domain.

[0:57] To recap, in order to allow Stripe Checkout to work client-side on our domain, we took myecomstore.vercel.app and we added it as a domain inside of our client-only integration, which we previously enabled, which will allow us to use Stripe Checkout for our site.

egghead
egghead
~ 24 minutes ago

Member comments are a way for members to communicate, interact, and ask questions about a lesson.

The instructor or someone from the community might respond to your question Here are a few basic guidelines to commenting on egghead.io

Be on-Topic

Comments are for discussing a lesson. If you're having a general issue with the website functionality, please contact us at support@egghead.io.

Avoid meta-discussion

  • This was great!
  • This was horrible!
  • I didn't like this because it didn't match my skill level.
  • +1 It will likely be deleted as spam.

Code Problems?

Should be accompanied by code! Codesandbox or Stackblitz provide a way to share code and discuss it in context

Details and Context

Vague question? Vague answer. Any details and context you can provide will lure more interesting answers!

Markdown supported.
Become a member to join the discussionEnroll Today