Cordova/Phonegap bindings for Razorpay's Mobile SDKs


Official Cordova/Phonegap plugin for integrating Razorpay's checkout.

Supported platforms

- Android
- iOS
- Browser

You can check out the sample apps for:-
* Cordova v9.0
* ionic1
* ionic2
* ionic3
* ionic5

Usage:

Install the plugin

Note: For Windows users, please run this on Git Bash instead of Command Prompt. You can download Git for Windows here.

``bash
cd your-project-folder
cordova platform add android # optional
cordova platform add ios # make sure your ios version is ios@5 or latest.
cordova platform add browser # optional
cordova plugin add https://github.com/razorpay/razorpay-cordova.git --save

`
(or, phonegap plugin add https://github.com/razorpay/razorpay-cordova.git --save)

Note: Make sure that you set Always Embed Swift Standard Libraries of your main target to yes.

Note: Remember to enable bitcode on your iOS project. We support Xcode 11+ versions.

Integration code

$3

With the advent of auto-capture using Order API, the integration needs to change a little (only if you are using this flow). The only change is that the callbacks have to be added as events. Here is a code sample:

`js
var options = {
description: 'Credits towards consultation',
image: 'https://i.imgur.com/3g7nmJC.png',
currency: 'INR',
key: 'rzp_test_1DP5mmOlF5G5ag',
order_id: 'order_7HtFNLS98dSj8x',
amount: '5000',
name: 'foo',
theme: {
color: '#F37254'
}
}

var successCallback = function(success) {
alert('payment_id: ' + success.razorpay_payment_id)
var orderId = success.razorpay_order_id
var signature = success.razorpay_signature
}

var cancelCallback = function(error) {
alert(error.description + ' (Error '+error.code+')')
}

RazorpayCheckout.on('payment.success', successCallback)
RazorpayCheckout.on('payment.cancel', cancelCallback)
RazorpayCheckout.open(options)
`

Change the options accordingly. Supported options can be found here.

$3

To add a wallet, change the options JSON as follows:
`js
var options = {
currency: 'INR',
key: 'rzp_test_1DP5mmOlF5G5ag',
amount: '5000',
external: {
wallets: ['paytm']
},
...
...
...
}
`

To get callback for this, add this before calling open:
`js
RazorpayCheckout.on('payment.external_wallet', externalWalletCallback)
`

$3

This is legacy integration code and we will continue to support it till further notice. Your server needs to send capture request in this scenario, after the payment is completed.

`js
var options = {
description: 'Credits towards consultation',
image: 'https://i.imgur.com/3g7nmJC.png',
currency: 'INR',
key: 'rzp_test_1DP5mmOlF5G5ag',
amount: '5000',
name: 'foo',
theme: {
color: '#F37254'
}
}

var successCallback = function(payment_id) {
alert('payment_id: ' + payment_id)
}

var cancelCallback = function(error) {
alert(error.description + ' (Error '+error.code+')')
}

RazorpayCheckout.open(options, successCallback, cancelCallback)
`

Android Lifecycle Guide

Since our plugin launches a new activity on Android, the cordova activity goes in the background
and might get destroyed by the Android System. For this scenario, you need to add the following code to make sure the
payment result is delivered after the cordova activity is recreated:
`
// You need to register an event listener for the resume event
document.addEventListener('resume', onResume, false);
var onResume = function(event) {
// Re-register the payment success and cancel callbacks
RazorpayCheckout.on('payment.success', successCallback)
RazorpayCheckout.on('payment.cancel', cancelCallback)
// Pass on the event to RazorpayCheckout
RazorpayCheckout.onResume(event);
};


`

Things to be taken care:

- Add the integration code snippet after deviceready event.

- On browser platform, change the Content Security Policy to whitelist the razorpay.com domain.

`html


`

- Due to the way ionic works, we can't support ionic serve at the moment. Try using ionic run browser instead of ionic serve. ionic serve` doesn't support cordova browser plugins at the moment. See driftyco/ionic-cli#354.

FAQ

If you are still not able to integrate, then go to FAQ.

Note

We don't support capacitor because of the app support dependency, for more details go through this link.