Generate QR Code

A simple guide on how to generate QR code.

This guide outlines the steps for generating a UPI QR code, facilitating a streamlined payment gateway for Onramp users. By leveraging UPI deep linking, we provide a frictionless payment experience, crucial for businesses and developers who require an efficient transaction process.

Generating UPI QR Codes

To offer a seamless UPI-based payment flow, Onramp utilizes UPI deep linking to generate a QR code. The UPI (Unified Payments Interface) deep linking allows the integration of payment details directly into the QR code, simplifying the payment procedure for users.

Here is a sample response when an order is created using create transaction.

Response

{
    "status": 1,
    "code": 200,
    "data": {
        "transactionId": "636",
        "createdAt": "2023-12-08 00:55:24",
        "fiatAmount": "123.06",
        "fiatPaymentInstructions": {
            "type": "UPI",
            "upi": {
                "vpa": "onramp@hdfcbank",
                "name": "Onramp money"
            },
            "upiNotes": [
                {
                    "type": 1,
                    "msg": "Try Bank transfer from UPI apps if UPI deposit fails."
                }
            ],
            "otp": "1313"
        }
    }
}

Explanation

• status -> 0 is for unsuccessful request, 1 is for a successful one

• transactionId -> unique identifier of the transaction

• createdAt -> time at which the transaction was created.

• fiatAmount -> The amount of fiat that the user would deposit to their bank account.

• fiatPaymentInstructions -> This contains the payment instructions.

• type -> payment method type

• upi -> UPI details to which the deposit needs to be made.

• upiNotes -> additional information regrading bank account and current status.

• otp -> reference number (or aka confirmation code)

Here are a few examples of UPI deep links for different UPI-enabled apps:

• Paytm: paytmmp://pay?pn=merchantName&pa=merchantname@hdfcbank&am=1.00&tn=1234

• PhonePe: phonepe://pay?pn=merchantName&pa=merchantname@hdfcbank&am=1.00&tn=1234

• Google Pay: gpay://upi/pay?pn=merchantName&pa=scrol@hdfcbank&am=1.00&tn=1234

• BHIM: bhim://mandate?pn=merchantName&pa=merchantname@hdfcbank&am=1.00&tn=1234

• UPI: upi://pay?pn=merchantname&pa=merchantname@hdfcbank&am=123.06&tn=1234

Explanation of the deep link components:

1. pay: UPI transaction type (payment request).

2. pn: Payee name (e.g. merchantName -> Onramp money).

3. pa: Payee UPI ID (e.g. merchantname@hdfcbank -> onramp@hdfcbank).

4. am: Amount to be paid in INR(₹)(e.g. ₹100.00 or ₹123.06).

5. tn: Transaction note (e.g. otp -> 1313) .

The transaction note (tn) in the deep link is an important parameter for onramp.money's quick reconciliation process. The transaction note should contain the OTP generated when the createTransaction endpoint is called. This helps onramp.money to quickly reconcile transactions. We strongly recommend partners to pass this transaction note (OTP) when creating UPI deep links.

By using UPI deep links with the appropriate transaction note, your users can enjoy a seamless payment flow, and you can benefit from faster reconciliation

UPI deep link QR code example

To view and test the code to generate deep link UPI QR codes, please explore the codePen block below.