Create payment requests

You can create a payment request using JavaScript. The following sections provide some basic examples:

• Create a payment method
• Create order details
• Create payment request object
• Check user readiness for payment
• Show payment UI
• Handle payment response

Create a payment method

To create a payment request, add Google Pay and its details in your supporting methods. The Unified Payment Interface (UPI) payment mechanism is supported in Google Pay. This means you need to specify the URL and UPI fields while creating the payment request object.

For example:

supportedMethods: "https://tez.google.com/pay"
pa: the retailers vpa to receive the money.

Constructing a new PaymentRequest object can be done at any point in your site or app. Until you call its show() method, nothing will be displayed.

Mandatory fields

To make UPI transactions, the following fields are required:

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.)

Optional fields

Fields	Description
tid	Deprecated This field must be kept unset.
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

Create a payment request

The following code snippet illustrates how to add Google Pay as the supported payment method and define the mandatory fields. The fields associated with the order amount, such as am and cu, must be defined in the detailed object. To define order value, see Create order amount.

  const supportedInstruments = [
    {
      supportedMethods: ['https://tez.google.com/pay'],
      data: {
        pa: 'merchant-vpa@xxx',
        pn: 'Merchant Name',
        tr: '1234ABCD',  // your custom transaction reference ID
        url: 'http://url/of/the/order/in/your/website',
        mc: '1234', // your merchant category code
        tn: 'Purchase in Merchant',
        gstBrkUp: 'GST:16.90|CGST:08.45|SGST:08.45', // GST value break up
        invoiceNo: 'BillRef123', // your invoice number
        invoiceDate: '2019-06-11T13:21:50+05:30', // your invoice date and time
        gstIn: '29ABCDE1234F2Z5', // your GSTIN
      },
    }
  ];

You must supply an array of objects that indicate your supported Payment method as Google Pay. Each Payment method must include a supportedMethods parameter that identifies the Payment method. You must also pass values for the mandatory fields in the array.

Important: The transaction reference ID is mandatory and must be unique for every request. This could be order number, subscription number, Bill ID, booking ID, insurance renewal reference, etc.

After you create the Payment method and values for its required parameters, you must define the order amount in the PaymentRequest object. To define amount, see Create order amount.