In the 2020s, the COVID-19 pandemic has changed consumer behavior, they are spending more and more on e-commerce platforms compared with traditional shopping methods. To fill the demand of online shopping, e-commerce platforms are looking the ways to improve the user experience such as improving UX/UI, increasing product variety, enhancing the platform speed, and especially securing the payment. One of the most popular payment methods for e-commerce is third-party integration such as Stripe, Paypal, and Square… In this article, we will explore more about online payment and focus on Stripe integration.

Overview of online payments

What is online payment?

Online payment is a payment service made on devices such as computers, and smartphones through the Internet connection. As long as you have money in your account, you can easily send it to the recipient on the digital platform/app without using cash. To make online payments, everything you need is a bank account/card number and a smart device connected to the Internet
There are various online payment methods such as wire transfers, payment wallets, or credit/debit cards via a payment gateway such as PayPal, Stripe, or Square…

Online payment brings many benefits to consumers as well as merchants including:

  • Save time and costs: Online payment will save a lot of time as well as reduce other legal costs. Along with the rise of digital technology, everyone can own a smartphone at a reasonable price. So that, we can easily make an online payment to save time and commuting costs to the bank or seller’s checkout point. With this kind of payment, it only takes you around 1-3 minutes to make a payment anywhere, anytime.
  • Easy control financial: Every transaction is recorded, which makes financial control easier and helps to manage expenses more effectively.
  • High security: We don’t have to face the risks of using cash such as counterfeit money, mistakes in money counting, theft, or robbery. Online payment requires strict requirements in the steps of authentication to make it more secure.

Besides the benefits mentioned above, we also have certain limitations:

  • Error system: we cannot make payments/transactions when the system fails
  • Private information leak: The risk of losing account information and personal information when making unorthodox transactions

Currently, there are a lot of online payment methods as we discussed above, but in this article, we will only learn details of the Stripe payment gateway

Stripe and Stripe integration

Stripe is an American payment gateway established in 2010 that allows e-commerce sites to receive payments on their sales websites. In addition, Stripe also provides SDK for customers to integrate on iOS or Android devices. It also provides Stripe API to support different programming languages like Ruby, Python, Java, and GO,….

Advantages of Stripe

Disadvantages of Stripe

Developing a shopping site with stripe integration (demo)​

Build the basic interface

We will build a simulation shopping website with the website name Sparkminds provides basic features such as buying/selling products, depositing money into the shop wallet, and registering merchants to be able to sell products.

Above is the main interface of our shopping website, after login, we will have the following interface:

After registration and successful login, it is necessary to perform additional merchant registration operations to have the rights to sell products.

Next, there is a deposit operation into the wallet.

In addition, we can view the transaction and payment history on the transaction history page.

When entering each product, we can see detailed information about that product.

For users who have registered merchants, they can add the new product to sell.

Stripe integration

We will integrate Stripe into the deposit step to make the conversion from USD to the shop’s coin, here our coin will be USDC.
First, we need to register a stripe account.

To be able to interact with Stripe, we need a public key and a secret key.

We need to install the dependency of stripe to be able to use the support methods from it.

Stripe API fully supports payment by redirecting to Stripe’s payment interface without any other authentication step

With Java programming language on the server side, we can easily configure by the following picture.

And if we don’t want to save the product to the stripe, we can customize the product as we want with the line_items field, we change it to product_data which contains the product details to be paid with the important fields: name, description, images

success_url is used to redirect to the success page if payment was successful and otherwise for cancel_url. In addition, we have fields: unit amount (the price of a product), quantity (quantity of products), currency (the currency used for the transaction), and mode (type of session) – here we use type payment.
When there are enough params above, proceed to create a session with the command:

Session session = Session.create(params);

The returned response will have a lot of fields but only need to use session_id and URL

When calling this URL, we will be redirected directly to the checkout page with the product information previously configured

In the case of our shop’s recharge: we configure the product to be the shop’s coin (USDC) with a conversion rate of 1 USDC/USD. As shown above, we enter the quantity of 123, for 1 USD/USD, we need to pay $123 for all. In test mode, the card information for successful payment will be 4242 4242 4242 4242 and the remaining parameters can be customized for each individual.

Create webhooks to get real-time updates

Next, to receive the results when the payment is successful, we need to create a webhook so Stripe automatically catches the event and returns the backend Server.
To create a webhook, we need to download the stripe CLI for listening to the stripe event on the local side

Stripe webhook will run on the cmd interface, listening to Stripe events, and returning responses to the local Server API (here we will respond to API localhost:8000/webhook)
If we already have a host, we can directly create a webhook endpoint.

For the next job, we just need to catch the response returned and process it from the Server side to perform adding the amount to the balance of the wallet for the user.

Also, we can see all events in the Events section on Stripe.

Finally, we have completed the integration of Stripe payments into our Sparkminds shop app.

Conclusion

Stripe is an ideal payment gateway for those doing international business. It brings convenience to the buyers when the payment operation is simple and intuitive. At the same time, the merchants can quickly receive payments after the customer pays for the order. This function is not available in customer payment gateways such as Paypal, or 2Checkout….
After reading this article, I hope you can implement the Stripe integration by yourself. Or, If you want to build an e-commerce platform including the stripe integration, Don’t hesitate to contact us for our custom web/app implementation service.