Integrating Razorpay Payment Gateway in your Flask E-Commerce app

python e-commerce flask html razorpay payment gateway

Razorpay is one of the most popular payment services in India with a significant amount of customers because of its ease of use. This is a  short, crisp, and precise tutorial on integrating the service on your python-based backends like Flask or Django. For this tutorial, we will be only focusing on Flask but a very similar approach is followed in Django as well. 

"Pay with Razorpay" button

We now need to generate a simple HTML page where we just need to place the Pay with Razorpay button. Razorpay provides the provision for this too through a js script that you just need to literally paste in your HTML and customize as per your needs. 

The given div tag imports the script through Razorpay. Jinja 2 has been used a templating engine to fill the values returned by payment and razorpay object in the previous step. You can customize your payment gateway here as well by putting description, image, theme color, etc. Refer to the documentation for more details: https://razorpay.com/docs/payment-gateway/quick-integration/

 

The payment gateway on the frontend would look something like this. You can clearly notice the Test Mode tag on the top-right because we have used test keys until now. This is efficient for testing because we can put some test Card Details like 5555 5555 5555 4444 and any valid expiry and random CVV to see if it works. More details on this here:

https://razorpay.com/docs/payment-gateway/test-card-upi-details/

 

Once you click, on the Pay INR 999, the gateway asks if you want to make the payment successful or fail it. This is only visible in the test mode and not in live mode (of course). If the payment is successful, the URL is directed to /success and you further redirect to a "Payment Successful" page from the Dashboard. The successful payment with all the user details in the notes JSON object is shown in your Transaction tab on the Razorpay Dashboard.

In case of payment failure, the gateway will try to attempt the payment again for the same order id (only if the page is not reloaded) 

Discussion