This integration allows you to integrate with a Cashfree hosted payment page. Below is a step-by-step guide for each part of the integration process.
Requirements
- Create a Cashfree Merchant Account.
- Log in to the Merchant Dashboard and generate test keys from Cashfree Dashboard.
- Generate API Keys - Client ID & Secret Key.
Step 1: Create a Plan
API Documentation: Create Plan
curl --request POST \
--url https:
--header 'accept: application/json' \
--header 'content-type: application/json' \
--header 'x-api-version: 2023-08-01' \
--header 'x-client-id: xyz' \
--header 'x-client-secret: abc' \
--data '{
"plan_id": "plan_cashfree_sbox",
"plan_name": "Premium_10",
"plan_type": "ON_DEMAND",
"plan_currency": "INR",
"plan_max_amount": 100,
"plan_note": "Test Plan Cashfree"
}'
Step 2: Create Subscription
API Documentation: Create Subscription
curl --request POST \
--url https:
--header 'accept: application/json' \
--header 'content-type: application/json' \
--header 'x-api-version: 2023-08-01' \
--header 'x-client-id: xyz' \
--header 'x-client-secret: abc' \
--data '{
"customer_details": {
"customer_name": "Sushane Yadav",
"customer_email": "sushane.yadav@abc.com",
"customer_phone": "9999999999",
"customer_bank_account_holder_name": "Sushane Yadav",
"customer_bank_account_number": "010080198715",
"customer_bank_ifsc": "ICIC0001008",
"customer_bank_code": "ICIC",
"customer_bank_account_type": "SAVINGS"
},
"plan_details": {
"plan_id": "plan_cashfree_sbox",
"plan_name": "Premium_09",
"plan_type": "ON_DEMAND"
},
"authorization_details": {
"authorization_amount": 1,
"authorization_amount_refund": true,
"authorization_time": 1
},
"subscription_tags": {
"subscription_note": "test create subs"
},
"subscription_meta": {
"return_url": "https://wa.me/8473222?textPayment%20Successfull",
"notification_channel": [
"EMAIL",
"SMS"
]
},
"subscription_id": "create-ondemand-subs-12",
"subscription_expiry_time": "2028-12-24T14:15:22Z"
}'
Step 3: Initiate an Auth
Use the subscription_session_id received in the response of create subscription to initiate the subscription auth checkout.
Refer to below code module to integrate :-
const paymentMessage = document.getElementById("paymentMessage");
const cashfree = Cashfree({
mode: "sandbox"
});
document.getElementById("subsCheckout").addEventListener("click", function(){
paymentMessage.innerText = "";
paymentMessage.classList.remove("alert-danger");
paymentMessage.classList.remove("alert-success");
cashfree.subscriptionsCheckout({
subsSessionId: document.getElementById("subsSessionId").value,
redirectTarget: "_blank"
}).then(function(result){
if(result.error){
document.getElementById("paymentMessage").innerHTML = (result.error.message)
}
})
})
Try out here: codepen
- Take the subscription_session_id and paste it in the codepen link and click on submit.
- You will be redirected to the subscription checkout page.
- Choose the payment mode you want to setup the subscription and submit. In case of sandbox you will be asked to simulate the payment.
- You will be redirected to the return url post the transaction is completed.
Step 4: Get Subscription Details
Use this API to check the subscription status and auth details post completion of the payment.
API Documentation: Get Subscription
curl --request GET \
--url https:
--header 'accept: application/json' \
--header 'x-api-version: 2023-08-01' \
--header 'x-client-id: xyz' \
--header 'x-client-secret: abc'
Step 5: Raise a charge on subscription
API Documentation: Raise a charge
curl --request POST \
--url https:
--header 'accept: application/json' \
--header 'content-type: application/json' \
--header 'x-api-version: 2023-08-01' \
--header 'x-client-id: xyz' \
--header 'x-client-secret: abc' \
--data '{
"subscription_id": "create-ondemand-subs-12",
"payment_id": "test-payment-subs-07",
"payment_type": "CHARGE",
"payment_amount": 10,
"payment_remarks": "first payment",
"payment_schedule_date": "2024-11-30T14:15:22Z"
}'
