Integrate Instamojo Payment Gateway | Version 2 | HackerRahul

Integrate instamojo payment gateway

Hey, Guys here is an updated tutorial as many of you guys requested me on youtube and blog that they want to integrate on page payment gateway like a pop-up appears for payment and then fill in card details and checkout directly without redirecting to the instamojo website. So in new Instamojo Documentation, they have introduced new web integration API with javascript SDK to have on page payment integration.

Download Demo Subscribe on youtube

First of all here is a short video explaining how this updated version works, so watch this video is you are lazy to read this whole article.

and you can also read the full article explaining each and everything about instamojo integration and updated things

So let’s get Started,

It’s a very similar tutorial as I have already discussed the main points in the previous tutorial of Instamojo Payment gateway integration that what is Instamojo. So in this tutorial, I am only going to show that what is new in this tutorial

and if you want to know the basics of Instamojo integration then head over to Instamojo Payment gateway integration

First of all, you need to register on Instamojo website. If you register using my link and receive your first payment on Instamojo, then you will get Rs.500 for free. So click on the button below and register and receive your first payment and get free Rs.500 for free.

Register on Instamojo and get Rs.500

So in this tutorial, we are using the Instamojo function.

So here is a function Instamojo.open(‘payment link here’); that Instamojo new javascript SDK includes.

So basically what it does is that you can paste in your profile URL like mine is

 https://www.instamojo.com/@hackerrahul/

and paste it inside the function Instamojo.open(); then it will create a payment link in which you can set the custom amount and pay to me (for Ex. Donation link.)

so if you are integrating it into something like e-commerce web app you don’t need your customers to type in the amount of the product. it should be dynamic.

So you can use create request API to create a payment link.

all the local variables on the top should be dynamic from the database and the amount should be according to the user-selected product.

When you run this script, it will return a bunch of data in the form of an array.

and one item of the array will be long URL which is our payment link

The format of the payment link is like.

https://www.instamojo.com/@ashwch/d66cb29dd059482e8072999f995c4eef/

First will be instamojo.com/Your_Username/Payment_Id. Payment id is also present in the response separately.

and when you pass this payment URL in the function like this it will pop-up the window of payment, in which you can fill up your debit/credit card details and checkout.

Instamojo.open(‘https://www.instamojo.com/@ashwch/d66cb29dd059482e8072999f995c4eef/’);

In this tutorial, I am showing just a method that how you can integrate javascript SDK in your project for on-page payment gateway integration without refresh.

So you Can check out the demo above to Check the how the whole process is working.

I have not created a product as I am not using the database interaction in this tutorial so you will be manually adding the payment amount in the demo and checkout.

Note – Instamojo does not allow payment below Rs.10. and it does not work in localhost so you need a live server to test it out.

If you need the hosting account then you should go for Hostinger and also get free domain and SSL certificate for free Lifetime.

Check out hostinger by clicking the image below.

Hotsinger banner

So I hope you like the Post and if you want to get notified for the latest Post on my blog in your Email then please subscribe to my blog by filling the subscription form below and subscribe my channel HackerRahul.

 

If you Want to donate and help out this blog, Then please donate by clicking on the button below!

Donate