Implementing WebUPI as a UPI Provider

Ninjapay

Protocol spec — Nalanda Naidu CTO — https://ninjapay.in/

WebUPI Guide



Get Started

WebUPI is designed to allow web applications to interact seamlessly with UPI enabled applications. This guide is intended to help UPI providers implement the WebUPI API.

1. WebUPI.enable()

The first step in the implementation process is to establish a method to enable the WebUPI provider. This method should prompt the user for permission to use the WebUPI capabilities. After that, you are free to implement any of the other API methods.

Method


async function enable(): void;

Example


try {
  if(typeof window.webUPI !== 'undefined') {
    await window.webUPI.enable();
  }
}
catch(error) {
  // User denied permission or cancelled
  console.log(error);
}

Join us in revolutionizing online payments with WebUPI!


2. WebUPI.sendPayment()

This method enables the user to send a payment. The web application provides a UPI URI for the payment.

Method


async function sendPayment(args: SendPaymentArgs): SendPaymentResponse;

Parameters


interface SendPaymentArgs {
  upiUri: string; // the UPI URI you'd like the user to pay.
  callback_url?: string; // webhook url to send status response upon payment.
}

Response


interface SendPaymentResponse {
  transactionId: string;
}

Example


const upiUri = "upi://pay?pa=example@upi&pn=Example&mc=0000&tid=000000000000&tr=Transaction123456789012345&tn=TestTransaction&am=10.01&cu=INR&mam=null";
const result = await window.webUPI.sendPayment(upiUri);

3. WebUPI.makePaymentRequest()

This method allows the user to generate a UPI URI to be used by the web app.

Method


async function makePaymentRequest(args: RequestPaymentArgs): RequestPaymentResponse;

Parameters


interface RequestPaymentArgs {
  payeeVpa: string;
  payeeName: string;
  transactionId: string;
  transactionNote: string;
  transactionAmount: number;
  currencyCode: string;
  minimumAmount: number | undefined;
  maximumAmount: number | undefined;
}

All amounts are denominated in the currency code provided.

Response


interface RequestPaymentResponse {
  upiUri: string;
}

Code Example


await webUPI.enable();
const paymentRequest = await webUPI.makePaymentRequest({
  payeeVpa: "example@upi",
  payeeName: "Example",
  transactionId: "Transaction123456789012345",
  transactionNote: "TestTransaction",
  transactionAmount: 10.01,
  currencyCode: "INR",
  minimumAmount: undefined,
  maximumAmount: undefined
});

4. Error Handling

All methods should throw an error when the operation cannot be completed. This allows applications to handle failures gracefully.

Please note that this is a high-level guide and specific implementation details may vary depending on the specific requirements of the UPI provider. Always refer to the official UPI documentation and ensure compliance with all relevant regulations and guidelines.


NPCI UPI Linking Specs

Last updated