9

I am a newbie in programming. I want to create an HTML page which have some buttons to invoke popular UPI payments apps like Google Pay, Paytm, PhonePe, etc. but I don't know how to invoke those application and passing them a url

upi://pay?pa=xyz@paytm&pn=Paytm%20Merchant&mc=abc&mode=02&orgid=000000&paytmqr=abcdefg&sign=abc+xyz/pqr/+stu

Like this:

<a href="<protocol to invoke app with the upi url parameter>">
  Donate/Pay via this Payment App
</a>

I can tell you the reference like What app https://api.whatsapp.com/send?phone=<country-code-digit><10-digitmobile-number> start the chat with given phone number in the url after verifying if that number with country code exist in whatsapp user list.

Dharmaraj
  • 47,845
  • 8
  • 52
  • 84
Sahyog Vishwakarma
  • 330
  • 1
  • 2
  • 11
  • From where did you get that example URL (UPI)? – Swetank Poddar May 17 '20 at 14:32
  • i have notices some websites/mobile apps invoke upi payment apps to pay bill or recharge or any UPI payment for eg. My Airtel App can invoke paytm and google pay to add money to airtel payment bank or during payments. – Sahyog Vishwakarma May 17 '20 at 14:39
  • That does not mean they use an URL to invoke UPI. They most probably have a payment portal which they use to initiate the UPI payments. There is no `upi` protocol. – Swetank Poddar May 17 '20 at 15:23
  • In my vision they are invoking Apps. Web Just make request to UPI apps by asking UPI I'd but Airtel thanks app Just open that Mobile application which we select either Google pay or Paytm – Sahyog Vishwakarma May 17 '20 at 16:11
  • if the UPI is not isntalled then how it works ? – Shammas Pk Jul 21 '23 at 06:03

5 Answers5

19

We can use anchor tags to invoke UPI apps (GPay, PhonePay, PayTm, BHIMPay, AmazonPay or any UPI Apps).

For example -

<a href="upi://pay?pa=upiaddress@okhdfcbank&pn=JohnDoe&cu=INR">Buy Now</a>

To make UPI transactions, we can use the following fields:

Fields Description
pa Payee address or business virtual payment address (VPA).
pn Payee name or business name.
mc Business retailer category code.
tr Transaction reference ID. (Business specific ID. Must be unique for each request.)
url Transaction reference URL.
am Transaction amount. (Up to two decimal digits are allowed. This should be set in the details object instead of the supportedInstruments object.)
cu Currency code. (This should be set in the details object instead of supportedInstruments object. Only the Indian rupee (INR) is currently supported.)
tid Transaction ID generated by the payment service provider (PSP) of the business.
tn Transaction note. It is the description appearing in the Google Pay payflow. (Maximum length is 80 characters)
gstBrkUp Break-up of Goods and Services Tax. This should follow the format: `GST:amount
invoiceNo Invoice Number. Identifier of a bill/invoice.
invoiceDate The time of invoice in RFC 3339 format. Eg, 2017-02-15T16:20:30+05:30 for IST timezone).
gstIn Business GSTIN. Goods and Services Tax Identification Number.

For a complete list of supported fields, refer to the NPCI UPI Linking Specs.

Tirtharaj Ghosh
  • 267
  • 2
  • 10
  • Ok fine . But amount parameter is not working.Can you help me. – Ganesan J Feb 25 '23 at 05:10
  • 1
    if the UPI is not isntalled then how it works ? – Shammas Pk Jul 21 '23 at 06:03
  • @ShammasPk To tackle this kinda situation, developers gotta whip up some nifty logic. They'll need to check if there's a UPI app installed on the user's device before going all gung-ho with the URL invocation. If there's no UPI app, they can gracefully redirect the user to the PlayStore or App Store, or simply show an error message. But hey, remember, it's a mix-and-match game here, so they gotta consider the framework they're using, the programming language they've got going on, and the OS of the user's device. It's all about making things smooth and seamless for the users! ‍ – Tirtharaj Ghosh Jul 24 '23 at 08:42
  • Actually not working 100%. After Pay, it shows ```You've exceed the bank limit.``` even 1 rs. txn. in other hand, you can go to gpay and manually pay. then it's working. so something wrong with this URL. – Shurvir Mori Aug 19 '23 at 08:38
  • @ShurvirMori For most cases, the transaction limit is up to Rs 1 Lakh per transaction & 10 transactions per day. It is set by banks. Check https://www.quora.com/What-is-the-solution-for-this-error-You-have-exceeded-the-maximum-transaction-amount-set-by-your-bank-z8 – Tirtharaj Ghosh Aug 25 '23 at 11:41
  • @TirtharajGhosh, 1 Rs. txn is also not working I had tested with 1, 10,50,100 . but not working in GPay, but same bank work in PhonePay. but in GooglePay If i try paying manually then it's paying successfully. so not bank limit issue. – Shurvir Mori Aug 27 '23 at 20:14
18

This Code will open all UPI apps in mobile.

<a href="upi://pay?pa=UPIID@oksbi&amp;pn=FNAME SNAME K&amp;cu=INR" class="upi-pay1">Pay Now !</a>

Also adding spaces in the link won't break the URL

<a href="upi://pay?pa=UPIID@oksbi&amp;pn=JOHN BRITAS AK &amp;cu=INR" class="upi-pay1">Pay Now !</a>
Fenil Shah
  • 149
  • 1
  • 10
AdDev
  • 428
  • 5
  • 14
  • this url supports all kind upi apps in your mobie phone – AdDev Oct 07 '20 at 05:43
  • 2
    Thankyou Very much for this, can you please what are the parameters i can use within URL such as Name, message and amount? – Sahyog Vishwakarma Oct 10 '20 at 03:06
  • you can add your name{that must be shown in your bank account} and your upi id in this link – AdDev Oct 10 '20 at 04:51
  • GPay by Google is not listed in apps does it take something else? – Sahyog Vishwakarma Oct 10 '20 at 04:55
  • 1
    Is the upi id you entered in this link the same as the Google Pay UP id? If so, it may not work on your phone This will work on other people's phones. This problem only exists on GooglePlay – AdDev Oct 10 '20 at 05:03
  • you mean to say if i give UPI id other than GPay UPI ID then it will popup for Gpay app? – Sahyog Vishwakarma Oct 10 '20 at 05:17
  • no no No | everything have one upi id | but your link not working in Google pay with your own phone | its only show if this link in other peoples – AdDev Oct 10 '20 at 05:26
  • 1
    for example - creat the link with your friend's upi id . after that click on this link in your device. then your Google pay app popup will work in Good! – AdDev Oct 10 '20 at 05:28
  • Ok I got that thanks for the information bro. I appreciate your answer and replies. Thankyou thankyou very much and hope other people who want to achieve this will also get helped by this answer. – Sahyog Vishwakarma Oct 10 '20 at 05:28
  • HII @EliotAlderson this answer helped and its showing all the payment option and payment is also succussful. After that the flow takes back to our web app, so how to capture the response of payment. ?? – Noman khanbhai Nov 04 '21 at 09:59
  • This link is not working for iPhone Please help. – khurshed alam Dec 12 '21 at 06:41
  • Does it have an account number and IFSC combination as well? Instead of UPI id – Yashwardhan Pauranik Feb 04 '22 at 12:27
  • facing issue "your money has not been debited", how to fix this issue? – Ajith May 09 '22 at 12:33
  • 2
    Payment with link will only works with Merchant UPI (tested on phonepe business) not in normal UPI. – Chintan Patel May 30 '22 at 14:40
  • But the transaction failed...It only worked on paytm app – vInEnDeRsInGh Feb 01 '23 at 13:27
  • Your answer is working to me .But I am not able to amount parameter. Can you help me ? – Ganesan J Feb 25 '23 at 05:09
  • use "am" parameter to set amount – AdDev Feb 26 '23 at 12:51
  • im using ```upi://pay?pa=${upiId}&am=${amount}&cu=INR``` link to generate qrcode for it . it is working in phone pe, on scanning it is showing the name of payee with amount and if i add a invalid upi it throws a message of invalid upi but in google pay . it show invalid qrcode for all the qrcodes and even if i put a correct one it still shows invalid qrcode. can anyone help me with that – sandeepnegi Apr 04 '23 at 10:17
  • if the UPI is not isntalled then how it works ? – Shammas Pk Jul 21 '23 at 06:04
  • @ShammasPk then the a tag not gonna work if user not installed UPI apps, so you may have to check that the user installed an UPI app on the device. – AdDev Aug 10 '23 at 04:32
  • Actually not working 100%. After Pay, it shows ```You've exceed the bank limit.``` even 1 rs. txn. in other hand, you can go to gpay and manually pay. then it's working. so something wrong with this URL. – Shurvir Mori Aug 19 '23 at 08:39
  • @ShurvirMori it's working for everyone, so try check you have not exceed your banking transaction limit, or try another day – AdDev Aug 24 '23 at 08:40
  • how to close the bottom sheet modal, once click the link – Shammas Pk Sep 01 '23 at 09:11
2

I know I am late for the answer but this can definitely help if you want to open specific UPI app on a Button Click.

You can follow the same method as mentioned above with a slight additional change.

Below is the list of packages name for respective UPI apps

  • Google Pay (tez://upi/pay)
  • PhonePe (phonepe://pay)
  • etc...

You can embed a new link as mentioned below

phonepe://pay?pa=upiaddress@okhdfcbank&pn=JohnDoe&cu=INR

This will open the app instead of listing all UPI apps.

Note:-

Packages deeplinking can be different for ios & android apps.

Sumit Kumathalli
  • 41
  • 1
  • 4
0

It will only work on merchant account. you have to pass merchant code in parameters to complete the payment otherwise it will fail

vInEnDeRsInGh
  • 319
  • 1
  • 12
0

I'm using upi link and creating a qrcode from it to scan and pay feature . I don't know whether it will be helpful for other or not but if anyone using google pay , then you can use

upi://pay?pa=${upiId}&pn=%20&tr=%20&am=${amount}&cu=INR

for other upi apps like phonepe , paytm, amazon pay required paramters are

pa - vpa id 
am - amount(required, only if you want to receive a particular amount)

Eg:

upi://pay?pa=${upiId}&am=${amount}&cu=INR

but for google pay you also need to pass

pn= which is merchant name 
tr= transaction id

Note :- in case you don't know the merchant name and transaction id you can pass blank into it like &pn=%20&tr=%20

It worked for me .

sandeepnegi
  • 123
  • 13