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://sandbox.cashfree.com/pg/plans \
  --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://sandbox.cashfree.com/pg/subscriptions \
  --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" // or production
});

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://sandbox.cashfree.com/pg/subscriptions/{subscription_id} \
  --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://sandbox.cashfree.com/pg/subscriptions/pay \
  --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"
}'