Accepting online payments with Stripe Checkout

Online payments were always hard. Customers enter sensitive information and we must protect it while charging them.

Fortunately, Stripe Checkout is a simple and secure built-in solution that goes a step beyond and guarantees that the information is invisible to everyone. And by saying everyone we really mean it. Neither people in charge of building the software solution nor the product owner have access to the credit card information.

But this can be confusing, how can I charge a customer if I can't see her/his credit card information? Well, let's dive deep into how Stripe Checkout works.

Usually, secured online credit card payments go through two steps:

  • Collect the payment method information. In this article, we only refer to a credit card, but could also be a debit card or bank account.

As we will see, these steps look like they are connected but they actually happen in different places.

Securely collect sensitive information

In order to use Checkout, we must first add a few lines of code in our application that will display a form where the client enters her/his credit card information: number, expiration date, and security code -sometimes more information may be required-.

The form will look similar to this:

Typical credit card form (image credits for Stripe)

That code is provided by Stripe and will gather the credit card information and send it directly to Stripe servers. This is extremely important: no credit card information will be sent to our application and only Stripe will receive and process that information.

Stripe receives the credit card information and validates it to check if it's a real card. Then, Stripe allows us to access that card so we can charge the customer. But, and here is the important thing, Stripe won't send us the credit card information but a key, with a format similar to this: src_1Fqhzh2eZvKYlo2CiZCJ5ll1.

This key has no meaning for anyone else rather than the owner of the application (and owner of the Stripe account that will charge the customer). Then, when the application wants to charge the customer, instead of working directly with the sensitive information of the credit card, it will use that key, also known as Token.

This process of collecting information from the credit card and converting it into a token is called, wait for it, tokenization. Wait…what?

Yes, sounds difficult but it's no different from normal life. Think of human fingerprints. When someone is born is registered in some public institution where his/her fingerprints will be taken together with personal information. In exchange, the person will be given an identification number or ID. Since that moment, every time we use our fingerprints -for example when going through the migration office at the airport- our personal information can be accessed.

Continuing with the airport example, think of the advantages:

  • Only with our fingerprint, the government can check if we are who we say we are.

Same happens with the token provided by Stripe:

  • Stripe can be sure that the token belongs to a valid credit card. Remember that before generating that token Stripe validates the credit card.

Charging the credit card from our application

Once we have the token provided by Stripe, our application can charge the customer. It will make an API call to the Stripe API that will include an amount and the token. So, instead of manually charging the customer we delegate that on Stripe too. Our application would only interact with Stripe and say something like this:

Hey Stripe, please charge $XX to the credit card whose token is src_1Fqhzh2eZvKYlo2CiZCJ5ll1.

Then, if the token exists in Stripe and belongs to the Stripe Account that is trying to create the charge, the payment gateway will process the charge.

As explained, accepting card payments in our application is simple and secure with Stripe. Thanks to the infrastructure they built, and to the strong security measures they have adopted, collecting credit card information and processing payments are solved and we can just focus on our business.

This is a brief explanation of the process to accept payments using Stripe. The goal is to help the user to understand how things work, although there are many more pieces to consider. In any case, specific requirements should be analyzed to choose the best approach.

Are you planning to process payments online? Have you worked with any other payment gateway? Feel free to leave a comment below or contact us on our website: We have a bunch of experience building applications that integrate with Stripe or major gateways and we would love to help you enhance your business or idea.

And of course, if you liked this article don't forget to clap!

Unagi ( is a software company that designs and develops high-quality software to help clients to develop their ideas and optimize what they already know how to do. Our team includes engineers and analysts with more than 10 years of experience. We are all happy doing our work and we love getting into new experiences.

The Stripe name and logos are trademarks or service marks of Stripe, Inc. or its affiliates in the U.S. and other countries. Other names may be trademarks of their respective owners.

Co-founder Unagi