cashfree-pg-capacitor

The Cashfree Capacitor SDK allows you to integrate Cashfree Payment Gateway into your application and start collecting payments from your customers. It opens the payment page in a webview. The Capacitor SDK has been designed to minimise the complexity of handling and integrating payments in your Capacitor project.

Click here for more Documentation.

Install

$3

Run the following commands in your capacitor project.
``bash
npm install cashfree-pg-capacitor
npx cap sync
`

$3

$3

If the project's targetSdkVersion is 30 or above, add the following to your app Android Manifest file.
`xml









`

also register the plugin in MainActivity.java of your app.
Example
`java
import com.cashfree.capacitor.CFBridge;
...
public class MainActivity extends BridgeActivity {

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
registerPlugin(CFBridge.class); // register the plugin here
}
}
`

$3

Add the following code to application's info.plist file.
`xml
LSApplicationCategoryType

LSApplicationQueriesSchemes

phonepe
tez
paytm
bhim

`

---

API

* startPaymentWEB(...)
* startPaymentUPI(...)
* getUPIApps()
* getIcon(...)
* transFormUPIResponse(...)

$3

`typescript
startPaymentWEB(params: Object | Map) => Object
`
Parameters
* params : An Object or Map containg Request Parameters.

Returns
An Object containing the Response Parameters.

--------------------




$3

`typescript
startPaymentUPI(params: Object | Map) => Object
`
Parameters
* params : An Object or Map containg Request Parameters.

Returns
An Object containing the Response Parameters.

--------------------




$3

`typescript
getUPIApps() => Object
`
Returns
An Object containing the list of UPI apps installed in the User Phone supporting UPI intent payment mode.

Response Parameters:
- displayName: Display name of the app to be used to show in the UI.
- id: UPI app id to be used in UPI seamless Flow (with key appName).
- icon: Icon of the UPI app encoded in Base64 to show in the UI.

Sample response parsed to JSON:
`
[
{
“displayName”: “Gpay”,
“id”: “com.google.android.apps.nbu.paisa.user”,
“icon”: “iVBORw0KGgoAAAANSUhEUgAAALQAAAC0CAYAAAA9zQYyAAAAAXNSR0IArs4c6QAA... (in base64)”
},
{
“displayName”: “PHONEPE”,
“id”: “com.phonepe.app”,
“icon”: “iVBORw0KGgoAAAANSUhEUgAAALQAAAC0CAYAAAA9zQYyAAAAAXNSR0IArs4c6QAA... (in base64)”
}
]
`

--------------------




$3

`typescript
getIcon(base64String: string) => string
`
Parameters
* base64String : A base64 icon string obtained from 'icon' field of a UPIApp from getUPIApps.

Returns
A string prepended with data:image/png;base64, to make it usable as a source for image.

--------------------




$3


This function is created as a helper function specifially for typescript.
`typescript
transFormUPIResponse(result: any) => UPIApp[]
``
Parameters
* result : the response received from getUPIApps.

Returns
An array of UPIApp.

--------------------

Request and Response Parameters

$3

| Parameter | Required | Description|
| --- | ----------- | ----- |
|appId|Yes|Your app ID|
|orderId|Yes|Order or Invoice ID|
|orderCurrency|Yes|Currency code for the order.|
|orderAmount|Yes|Bill amount of the order|
|orderNote|No|Help text to provide customers with more information about the order.|
|customerName|No|Name of the customer|
|customerPhone|Yes|Phone number of the customer|
|customerEmail|Yes|Email ID of the customer|
|notifyUrl|No|Notification URL for server-server communication. Useful when a user's connection drops after completing the payment.|
|paymentModes|No|Allowed payment modes for this order. Available values: cc, dc, nb, paypal, upi, wallet.
Leave it blank if you want to display all modes.|
|tokenData|Yes|Token generated for the payment.|
|stage|Yes|Environment of the project setup (TEST or PROD)|
|appName|No|UPI app id when invoking seamless UPI intent.|

---

$3

These parameters are sent in the response Object. They contain the details of the transaction.

| Parameter | Description |
| --- | ----------- |
|orderId|Order id for which transaction has been processed. Example, GZ-212.|
|orderAmount|Order amount. Example, 256.00|
|paymentMode|Payment mode of the transaction.|
|referenceId|Cashfree generated unique transaction ID. Example, 140388038803.|
|txStatus|Payment status for that order. Values can be, SUCCESS, FLAGGED, PENDING, FAILED, CANCELLED.|
|paymentMode|Payment mode used by customers to make the payment. Example, DEBIT_CARD, MobiKwik.|
|txMsg|Message related to the transaction. Will have the reason, if payment failed.|
|txTime|Time of the transaction.|
|type|Fixed value : CashFreeResponse. To identify the response is from Cashfree SDK.|
|signature|Response signature, more here.|

---