Additional Support for Payment Methods

The Razorpay Web Custom SDK lets you integrate the supported payment methods on your Website's Checkout form.

Fetch Payment Methods

Use the

Fetch Payment Methods API

to fetch the payment methods available for your account.

Below are the sample payloads for each payment method.

Bank Transfer

This payment method allows you to display your Customer Identifier details on the checkout. Your customers can make online bank transfers to this account.

Feature Request

This is an on-demand feature. Please raise a request with our
Support team
to get this feature activated on your Razorpay account.
Watch this video to know how to raise a feature enablement request on the Razorpay Dashboard.

There are no specific request parameters to be passed. Instead, you must pass the fetchVirtualAccount method for your Customer Identifier to get created and the details to appear on the checkout. Know more about

integrating bank transfer with Custom Checkout

Debit and Credit Card

In this case, data.method should be specified as card. Other required fields:

card[name]
card[number]
card[cvv]
card[expiry_month]
card[expiry_year]

razorpay.createPayment({
  amount: 5000,
  email: 'gaurav.kumar@example.com',
  contact: '9123456780',
  order_id: 'order_9A33XWu170gUtm',
  method: 'card',
  'card[name]': 'Gaurav Kumar',
  'card[number]': '4111111111111111',
  'card[cvv]': '566',
  'card[expiry_month]': '10',
  'card[expiry_year]': '20'
});

If you want to securely store the customer's card details as network tokens, know about

Saved Cards feature

EMI on Credit and Debit Cards

For EMIs, data is the same as the card, with the following differences:

method should be emi
An additional field, emi_duration corresponding to the number of months for EMI, should be included. After the customer selects the desired plan, pass the corresponding value in the emi_duration field.

Use the code given below:

razorpay.createPayment({
  amount: 300000,
  email: 'gaurav.kumar@example.com',
  contact: '9000090000',
  order_id: 'order_9A33XWu170gUtm',
  method: 'emi',
  emi_duration: 9,
  'card[name]': 'Gaurav Kumar',
  'card[number]': '5241810000000000',
  'card[cvv]': '123',
  'card[expiry_month]': '10',
  'card[expiry_year]': '30'
});

Fetch EMI Plans

To display the available EMI plans, use the Razorpay checkout helper methods to fetch the details of the EMI plans and display them. You can use the event ready, as shown below:

var razorpay = new Razorpay(...); // as before

    /**
       * The above code remains the same.
       * You can fetch the available EMI plans by adding the below code in your options.
       */
razorpay.once('ready', function() {
  console.log(razorpay.methods.emi_plans);
  console.log(razorpay.methods.netbanking);
})

razorpay.methods.emi_plans

string Lists the EMI-supported banks with their respective interest rates.

razorpay.methods.netbanking

string Contains the list of all banks and bank codes.

Cardless EMI

Cardless EMI is a checkout payment method that allows customers to convert their payment amount to EMIs. The user does not require a debit or credit card. Make payments via credits approved by the supported Cardless EMI payment partner.

Feature Request

This is an on-demand feature. Please raise a request with our
Support team
to get this feature activated on your Razorpay account.
Watch this video to know how to raise a feature enablement request on the Razorpay Dashboard.

Use the code given below:

razorpay.createPayment({
  amount: 5000,
  email: 'gaurav.kumar@example.com',
  contact: '9000090000',
  order_id: 'order_9A33XWu170gUtm',
  method: 'cardless_emi',
  provider: '<provider_name>'
});

Possible values for provider:

barb
cshe
hdfc
icic
idfb
kkbk
krbe
zestmoney
earlysalary
tvsc
walnut369

Netbanking

When method is netbanking, you need to pass an additional field bank as shown below:

razorpay.createPayment({
  amount: 5000,
  email: 'gaurav.kumar@example.com',
  contact: '9123456780',
  order_id: 'order_9A33XWu170gUtm',
  method: 'netbanking',
  bank: 'SBIN'
})

You can list the available banks using a drop-down for customers. You can obtain a list of banks using the

Fetch Supported Methods API

Wallet

When method is wallet, you need to pass an additional field wallet as shown below:

razorpay.createPayment({
  amount: 5000,
  email: 'gaurav.kumar@example.com',
  contact: '9000090000',
  order_id: 'order_9A33XWu170gUtm',
  method: 'wallet',
  wallet: 'mobikwik'
});

Possible values for wallet:

freecharge (default)
payzapp (default)
olamoney (requires
approval
)
phonepe (requires
approval
)
airtelmoney (requires
approval
)
mobikwik (requires
approval
)
jiomoney (requires
approval
)
amazonpay (requires
approval
)
bajajpay (requires
approval
)
paypal (requires
approval
and
onboarding
)
phonepeswitch (requires
approval
)

PhonePe Switch

You can accept in-app payments from your customers transacting in PhonePe Switch. Know more about

PhonePe Switch Integration

UPI

You can accept UPI payments using the collect flow. Know more about

Validate VPA

and

Saved VPA

Collect Flow

Customers enter their vpa or

phone number

on your UI and complete the payments on their respective UPI apps in collect flow.

You can now pass the vpa parameter in the upi array as shown below:

razorpay.createPayment({
  amount: 5000,
  email: 'gaurav.kumar@example.com',
  contact: '9123456780',
  order_id: 'order_9A33XWu170gUtm',
  method: 'upi',
  upi:
  {
    vpa: 'gauravkumar@somebank',
    flow: 'collect'
  }
});

You will need to ask VPA from the user, which can be a text field with a regex of ^.+@.+$.

UPI Payments Using Phone Number

You can accept UPI payments using phone number for the collect flow. Follow the steps given below:

You must collect the customer's phone number from your end.

Check if any vpa is associated with the given number and get the vpa_token for that number using the sample code given below:

var razorpay = new Razorpay({
  key: '<YOUR_KEY_ID>',
});

razorpay.verifyVpa(number)
  .then((data) => {
    // get and store data.vpa_token for initiating payment
    // you will get data.masked_vpa in this response which you can show the end user to accept payment on this vpa associated app
  })
  .catch(() => {
    // no vpa associated with the number, show an error to the user
  });

Pass the vpa_token parameter in the upi array as shown below:

razorpay.createPayment({
  amount: 5000,
  email: 'gaurav.kumar@example.com',
  contact: '9000090000',
  order_id: 'order_9A33XWu170XXXX',
  method: 'upi',
  upi: {
    vpa_token: 'f731951149df8903d374b117f921ab41',
    flow: 'collect'
  }
});

UPI QR Code

You can display a UPI QR Code at checkout. Customers can scan this QR code using a UPI app on their mobile phones to complete the payment.

Sample QR Code on Checkout

Ensure that you invoke/activate the QR Code only after a user clicks Show QR Code.

UPI QR code on Razorpay Payment Gateway custom web integration.

Pass the qr parameter in the upi array as shown below:

razorpay.createPayment({
  amount: 5000,
  email: 'gaurav.kumar@example.com',
  contact: '9123456780',
  order_id: 'order_9A33XWu170gUtm',
  method: 'upi',
  upi:
  {
    qr: true,
    timeout: 10
  }
});

timeout

optional

integer Indicates the time (in minutes) after which the QR code will expire. Possible values are between 1 to 10. The default value is 10.

Handy Tips

For the best experience, show QR codes only on desktops.

Intent Flow

You can avail the UPI Intent flow by integrating with the

Google Pay SDK

Intent Flow for Mobile Web

Using Razorpay, you can let your customers make UPI Intent payments on your mobile website. Customers can then proceed with the payment without navigating away from your mobile website. This leads to a faster checkout experience with higher success rates.

Know how to integrate with

UPI Intent on Mobile Web

Feature Enablement

The UPI Intent feature is usually available by default. If you are unable to access this feature, raise a request with our

Support team

to get this enabled on your Razorpay account.

Pay Later

You can enable your customers to make payments using the Pay Later service offered by various third-party providers such as:

Watch Out!

LazyPay services are temporarily disabled.

Prerequisites

Contact our
Support Team
to get this payment method enabled for your account.
Customers should be registered account holders of the Pay Later service providers.

Sample Code

After creating an order and obtaining the customer's payment details, send the information to Razorpay to complete the payment. You can do this by invoking createPayment and passing method=paylater and provider=<provider_name>.

Available providers with provider code:

GetSimpl: getsimpl
ICICI Bank PayLater: icic
FlexiPay by HDFC Bank: hdfc
LazyPay: lazypay

Watch Out!
LazyPay services are temporarily disabled.

razorpay.createPayment({
  amount: 200000,
  currency: 'INR',
  email: 'gaurav.kumar@example.com',
  contact: '9111145678',
  order_id: 'order_DPzFe1Q1dEObDv',
  method: 'paylater',
  provider: <provider_code>
});

Emandate

You can accept recurring payments from your customers using emandate, card or upi as the method. For more information about authorisation and subsequent payments, refer to the

Recurring Payments documentation

Feature Request

This is an on-demand feature. Please raise a request with our
Support team
to get this feature activated on your Razorpay account.
Watch this video to know how to raise a feature enablement request on the Razorpay Dashboard.

Workflow

Create a customer
.
Create an Order with method as emandate, nach or upi.
Collect authorisation transaction.
- Using custom checkout.
- Using an authorisation link.
Verify Tokens.
Charge subsequent payments.

Know more about

Recurring Payments APIs

Collect Authorisation Transaction

Use the sample checkout code given below:

razorpay.createPayment({
  amount: 0,
  currency: 'INR',
  email: 'gaurav.kumar@example.com',
  contact: '9111145678',
  order_id: 'order_EAbtuXPh24LrEc',
  customer_id: 'cust_E9penp7VGhT5yt',
  recurring: '1',
  method: 'emandate',
  bank: 'HDFC',
  auth_type: 'netbanking',
  'bank_account[name]': 'Gaurav Kumar',
  'bank_account[account_number]': '1121431121541121',
  'bank_account[account_type]': 'savings',
  'bank_account[ifsc]': 'HDFC0000001'
});

CRED

To add CRED as a payment method, you need to:

Pass the app_offer parameter in Orders API.
Pass the method and provider parameters in
Create Payment Method
.

1. Pass app_offer Parameter in Order

You must create an order using Orders API. In the response, you obtain an order_id which you must pass to Checkout.

POST

/orders

Request Parameters

amount

mandatory

integer The transaction amount, expressed in the currency subunit, such as paise (in case of INR). For example, for an actual amount of ₹299.35, the value of this field should be 29935.

currency

mandatory

string The currency in which the transaction should be made. See the

list of supported currencies

. Default is INR.

app_offer

optional

boolean Allow/do not allow customers to use CRED coins to make payments. This is used to prevent double discounting scenarios where customers have already availed discounts using voucher/coupon,and you do not want them to redeem Coins as well. Possible values:

true - Customer not allowed to use CRED coins to make payment.
false (default) - Customer can use CRED coins to make payment.

receipt

optional

string Your receipt id for this order should be passed here. Maximum length is 40 characters.

notes

optional

object Key-value pair that can be used to store additional information about the entity. Maximum 15 key-value pairs, 256 characters (maximum) each. For example, "note_key": "Beam me up Scotty”.

2. Pass Method and Provider Parameters During Payment Creation

razorpay.createPayment({
  amount: 12340,
  currency: 'INR',
  email: 'gaurav.kumar@example.com',
  contact: '9111145678',
  order_id: 'order_EAbtuXPh24LrEc',
  method: 'app',
  provider: 'cred'
});

Request Parameters

Along with the other checkout options, you must pass:

method

mandatory

string The method used to make the payment. Here, it must be app.

provider

mandatory if method=app

string Name of the PSP app. Here, it must be cred.