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.
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.
constsupportedInstruments=[{supportedMethods:['https://tez.google.com/pay'],data:{pa:'merchant-vpa@xxx',pn:'Merchant Name',tr:'1234ABCD',//yourcustomtransactionreferenceIDurl:'http://url/of/the/order/in/your/website',mc:'1234',//yourmerchantcategorycodetn:'Purchase in Merchant',gstBrkUp:'GST:16.90|CGST:08.45|SGST:08.45',//GSTvaluebreakupinvoiceNo:'BillRef123',//yourinvoicenumberinvoiceDate:'2019-06-11T13:21:50+05:30',//yourinvoicedateandtimegstIn:'29ABCDE1234F2Z5',//yourGSTIN},}];
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.
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.
[null,null,["Last updated 2024-10-16 UTC."],[[["\u003cp\u003eYou can integrate Google Pay into your website or app using JavaScript to accept UPI payments from users.\u003c/p\u003e\n"],["\u003cp\u003eCreating a payment request involves specifying mandatory fields like payee address, payee name, transaction ID, and amount, along with optional fields such as transaction notes and GST details.\u003c/p\u003e\n"],["\u003cp\u003eGoogle Pay integration requires a \u003ccode\u003ePaymentRequest\u003c/code\u003e object with \u003ccode\u003esupportedMethods\u003c/code\u003e set to 'https://tez.google.com/pay' and data containing necessary UPI details.\u003c/p\u003e\n"],["\u003cp\u003eThe transaction reference ID (\u003ccode\u003etr\u003c/code\u003e) must be unique for each payment request to ensure accurate transaction tracking.\u003c/p\u003e\n"],["\u003cp\u003eAfter creating the payment request object, you need to define the order amount before displaying the payment UI to the user.\u003c/p\u003e\n"]]],["To create a payment request with JavaScript, define Google Pay as a supported method, including its details and UPI fields within a `PaymentRequest` object. Mandatory fields for UPI transactions include `pa` (payee address), `pn` (payee name), `mc` (retailer category code), `tr` (unique transaction ID), `url`, `am` (amount), and `cu` (currency). Define the order amount separately. Optional fields like `tn` (transaction note), `gstBrkUp`, `invoiceNo`, `invoiceDate` and `gstIn` are also available.\n"],null,["# Create payment requests\n\nYou can create a payment request using JavaScript. The following sections provide\nsome basic examples:\n\n- [Create a payment method](#%20Create-payment-method)\n- [Create order details](/pay/india/api/web/create-order)\n- [Create payment request object](/pay/india/api/web/payment-request-object)\n- [Check user readiness for payment](/pay/india/api/web/user-readiness)\n- [Show payment UI](/pay/india/api/web/pay-ui)\n- [Handle payment response](/pay/india/api/web/handle-response)\n\nCreate a payment method\n-----------------------\n\nTo create a payment request, add Google Pay and its details in your supporting methods.\nThe Unified Payment Interface (UPI) payment mechanism is supported in Google Pay.\nThis means you need to specify the URL and UPI fields while creating the payment\nrequest object.\n\nFor example:\n\n`supportedMethods`: \"https://tez.google.com/pay\" \n\n`pa`: the retailers vpa to receive the money.\n\nConstructing a new `PaymentRequest` object can be done at any point in your site\nor app. Until you call its `show()` method, nothing will be displayed.\n\n### Mandatory fields\n\nTo make UPI transactions, the following fields are required:\n\n| Fields | Description |\n|--------|-------------------------------------------------------------------------------------------------------------------------------------------------------|\n| `pa` | Payee address or business virtual payment address (VPA). |\n| `pn` | Payee name or business name. |\n| `mc` | Business retailer category code. |\n| `tr` | Transaction reference ID. (Business specific ID. Must be unique for each request.) |\n| `url` | Transaction reference URL. |\n| `am` | Transaction amount. (Up to two decimal digits are allowed. This should be set in the `details` object instead of the `supportedInstruments` object.) |\n| `cu` | Currency code. (This should be set in the details object instead of supportedInstruments object. Only the Indian rupee (INR) is currently supported.) |\n\n### Optional fields\n\n| Fields | Description |\n|---------------|----------------------------------------------------------------------------------------------------------------|\n| `tid` | **Deprecated** This field must be kept unset. |\n| `tn` | Transaction note. It is the description appearing in the Google Pay payflow. (Maximum length is 80 characters) |\n| `gstBrkUp` | Break-up of Goods and Services Tax. This should follow the format: \\`GST:amount |\n| `invoiceNo` | Invoice Number. Identifier of a bill/invoice. |\n| `invoiceDate` | The time of invoice in RFC 3339 format. Eg, 2017-02-15T16:20:30+05:30 for IST timezone). |\n| `gstIn` | Business GSTIN. Goods and Services Tax Identification Number. |\n\nFor a complete list of supported fields, refer to the [NPCI UPI Linking Specs](https://www.npci.org.in/PDF/npci/upi/circular/2017/Circular18_BankCompliances_to_enbaleUPIMerchantecosystem_0.pdf)\n\n#### Create a payment request\n\nThe following code snippet illustrates how to add Google Pay as the supported payment\nmethod and define the mandatory fields. The fields associated with the order\namount, such as `am` and `cu`, must be defined in the detailed object. To define\norder value, see [Create order amount](/pay/india/api/web/create-order). \n\n const supportedInstruments = [\n {\n supportedMethods: ['https://tez.google.com/pay'],\n data: {\n pa: 'merchant-vpa@xxx',\n pn: 'Merchant Name',\n tr: '1234ABCD', // your custom transaction reference ID\n url: 'http://url/of/the/order/in/your/website',\n mc: '1234', // your merchant category code\n tn: 'Purchase in Merchant',\n gstBrkUp: 'GST:16.90|CGST:08.45|SGST:08.45', // GST value break up\n invoiceNo: 'BillRef123', // your invoice number\n invoiceDate: '2019-06-11T13:21:50+05:30', // your invoice date and time\n gstIn: '29ABCDE1234F2Z5', // your GSTIN\n },\n }\n ];\n\nYou must supply an array of objects that indicate your supported Payment method\nas Google Pay. Each Payment method must include a supportedMethods parameter\nthat identifies the Payment method. You must also pass values for the mandatory\nfields in the array.\n| **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.\n\nAfter you create the `Payment` method and values for its required parameters, you\nmust define the order amount in the `PaymentRequest` object. To define amount, see\n[Create order amount](/pay/india/api/web/create-order)."]]