#1 UPI QR decoded!

Ever wondered what you would get when you decode a UPI QR code. This article is all about that so that you can create your own QR to receive payments and will also guide you to make a webpage to receive UPI payments. Suppose you want to receive a payment from someone, you can just share this link with a specified amount to them which will redirect them to a UPI app. So let's begin the show :)

UPI QR

Once when I decoded a UPI QR using some tool online, this is what I got -

upi://pay?pa=somevpa@somebank&pn=My%20Name&tn=yourtext&am=200&cu=INR

So using this we can make QR's ourselves by embedding this text into them. Apart from this, there is something more interesting to observe in the embedding. It resembles a web URL, something like - https://pa1tech411.blogspot.com/2020/04/upi-qr.html?t=100 with payee VPA, name, message, and the amount being the URL variables.

Making your UPI payment link

Since it resembles a URL, what happens if we browse it?

It actually works!. Google Chrome and other browsers have become smart to identify UPI URLs and redirect us to UPI app when we browse them.

So, here is my Github repo, where I created a very simple webpage which takes UPI id and amount as URL variables and redirects you to UPI app on your phone, else if you browse it on your laptop/PC, it shows a QR which can be scanned on any UPI app to make make the payment. Take a look at the index.html file, its very easy to understand. I used a javascript plugin to render QR online. This feature is live @ 

https://pa1tech.github.io/upi/?<upi_id>&<amt>

For example, https://pa1tech.github.io/upi/?pmcares@sbi&116

Note: This webpage is purely a frontend site and doesn't store any of your info.

Github provides free hosting for static sites. How cool is it have a website for yourself! Do try it.

References:

1. To know more about UPI - https://en.wikipedia.org/wiki/Unified_Payments_Interface/
2. W3schools HTML tutorials - https://www.w3schools.com/html/
3. Passing URL parameters - https://html-online.com/articles/get-url-parameters-javascript/
4. Creating Github site - http://jmcglone.com/guides/github-pages/