Subscription Checkout Integration

Subscription Checkout Integration Android Guide

This integration allows you to integrate with a Telr Subscription checkout in your app.

Setting Up Mobile SDK

implementation 'com.cashfree.pg:api:2.1.27'

Step 1: Creating a Subscription

The first step in the Subscription Checkout integration is to create a subscription. You need to do this before any payment can be processed. You can add an endpoint to your server which creates this subscription and is used for communication with your frontend.

Subscription creation must happen from your backend (as this API uses your secret key). Please do not call this directly from your mobile application. You can use below-mentioned backend SDKs

Node

Creating Subscription from Node SDK

Java

Creating Subscription from Java SDK

Golang

Creating Subscription from Golang SDK

Dotnet

Creating Subscription from Dotnet SDK

Python

Creating Subscription from Python SDK

PHP

Creating Subscription from PHP SDK

Once you create subscription, you will get the subscription_id and subscription_session_id

Step 2: Opening the Subscription Checkout Payment Page

Once the subscription is created, the next step is to open the payment page so the customer can make the payment. Telr Android SDK offer below payment flow. To complete the payment, we can follow the following steps:

Enable Subscription flow flag in Android Manifest
Create a CFSubscriptionSession object.
Create a CFWebCheckoutTheme object (Optional).
Create a CFSubscriptionPayment object.
Set payment callback.
Initiate the payment using the payment object created from [step 3]

We go through these step by step below.

Enable Subscription flow flag

Add the Below entry to your Android manifest file. If you don’t enable this flag, SDK won’t provide a payment callback

<meta-data
      android:name="cashfree_subscription_flow_enable"
      android:value="true" />

Create a Subscription Session

This object contains essential information about the subscription, including the subscription session ID (subscription_session_id) and subscription ID (subscription_id) obtained from creation step. It also specifies the environment (sandbox or production).

CFSubscriptionSession cfSubsSession = new CFSubscriptionSession.CFSubscriptionSessionBuilder()
                    .setEnvironment(CFSubscriptionSession.Environment.SANDBOX)
                    .setSubscriptionSessionID(subscription_session_id)
                    .setSubscriptionId(subscription_id)
                    .build();

val cfSubsSession = CFSubscriptionSessionBuilder()
    .setEnvironment(CFSubscriptionSession.Environment.SANDBOX)
    .setSubscriptionSessionID(subscription_session_id)
    .setSubscriptionId(subscription_id)
    .build()

Customize Theme (Optional)

You can customize the appearance of the checkout screen using CFWebCheckoutTheme. This step is optional but can help maintain consistency with your app’s design. You can set the NavigationBarBackgroundColor which will set the color for status bar & cashfree loader

CFWebCheckoutTheme cfTheme = new CFWebCheckoutTheme.CFWebCheckoutThemeBuilder()
    .setNavigationBarBackgroundColor("#6A3FD3")
    .build();

val cfTheme = CFWebCheckoutThemeBuilder()
    .setNavigationBarBackgroundColor("#6A3FD3")
    .build()

Create Subscription Payment Object

CFSubscriptionPayment cfSubscriptionPayment = new CFSubscriptionPayment.CFSubscriptionCheckoutBuilder()
    .setSubscriptionSession(cfSubsSession)
    .setSubscriptionUITheme(cfTheme)
    .build();

val cfSubscriptionPayment = CFSubscriptionCheckoutBuilder()
  .setSubscriptionSession(cfSubsSession)
  .setSubscriptionUITheme(cfTheme)
  .build()

Setup payment callback

The SDK exposes an interface CFSubscriptionResponseCallback to receive callbacks from the SDK once the payment journey ends. This interface consists of 2 methods:

void onSubscriptionVerify(CFSubscriptionResponse cfSubscriptionResponse);
void onSubscriptionFailure(CFErrorResponse cfErrorResponse);

fun onSubscriptionVerify(cfSubscriptionResponse: CFSubscriptionResponse)
fun onSubscriptionFailure(cfErrorResponse: CFErrorResponse) 

Make sure to set the callback at activity’s onCreate as this also handles the activity restart cases.

public class YourActivity extends AppCompatActivity implements CFSubscriptionResponseCallback {
    ...
    @Override
    public void onSubscriptionVerify(CFSubscriptionResponse cfSubscriptionResponse) {
    }

    @Override
    public void onSubscriptionFailure(CFErrorResponse cfErrorResponse) {
    }

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_upi_intent_checkout);
        try {
          // If you are using a fragment then you need to add this line inside onCreate() of your Fragment
            CFPaymentGatewayService.getInstance().setSubscriptionCheckoutCallback(this);
        } catch (CFException e) {
            e.printStackTrace();
        }
    }
    ...

}

class YourActivity : AppCompatActivity(), CFSubscriptionResponseCallback {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_drop_checkout)
        try {
            CFPaymentGatewayService.getInstance().setSubscriptionCheckoutCallback(this)
        } catch (e: CFException) {
            e.printStackTrace()
        }
    }

    override fun onSubscriptionVerify(cfSubscriptionResponse: CFSubscriptionResponse) {
        Log.d("onSubscriptionVerify", "verifyPayment triggered")
    }

    override fun onSubscriptionFailure(cfErrorResponse: CFErrorResponse) {
        Log.e("onSubscriptionFailure", cfErrorResponse.message)
    }
...
}

Open Checkout Screen

Finally, call doSubscriptionPayment() to open the Telr Subscription checkout screen. This will present the user with the payment options and handle the payment process.

// replace the SubscriptionCheckoutActivity class with your class name
CFPaymentGatewayService.getInstance().doSubscriptionPayment(SubscriptionCheckoutActivity.this, cfSubscriptionPayment);

// replace the SubscriptionCheckoutActivity class with your class name
CFPaymentGatewayService.getInstance().doSubscriptionPayment(this@SubscriptionCheckoutActivity, cfSubscriptionPayment)

Step 3: Sample Code

package com.cashfree.sdk_sample.java;

import android.os.Bundle;
import android.text.TextUtils;
import android.util.Log;
import android.widget.Toast;

import androidx.appcompat.app.AppCompatActivity;

import com.cashfree.pg.api.CFPaymentGatewayService;
import com.cashfree.pg.core.api.CFSubscriptionSession;
import com.cashfree.pg.core.api.callback.CFSubscriptionResponseCallback;
import com.cashfree.pg.core.api.exception.CFException;
import com.cashfree.pg.core.api.subscription.CFSubscriptionPayment;
import com.cashfree.pg.core.api.utils.CFErrorResponse;
import com.cashfree.pg.core.api.utils.CFSubscriptionResponse;
import com.cashfree.pg.core.api.webcheckout.CFWebCheckoutTheme;
import com.cashfree.sdk_sample.R;

public class SubscriptionCheckoutActivity extends AppCompatActivity implements CFSubscriptionResponseCallback {
    String subsID = "sub_1936672690";
    String subsSessionID = "sub_session_Axr2QtKpKwh4_dQypuNwtkpy0uZ8wWbwejEv7gYqrsej2jfXDpQPfDfJr999H-ay9ipYx4-2ZIV6MXX-d7vodyuEHVpDDH43yavnmPiK9kTtNosm";
    CFSubscriptionSession.Environment cfEnvironment = CFSubscriptionSession.Environment.SANDBOX;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_drop_checkout);
        try {
            CFPaymentGatewayService.getInstance().setSubscriptionCheckoutCallback(this);
            doSubscriptionCheckoutPayment();
        } catch (CFException e) {
            e.printStackTrace();
        }
    }

    @Override
    public void onSubscriptionVerify(CFSubscriptionResponse cfSubscriptionResponse) {
        Log.d("onSubscriptionVerify", "verifyPayment triggered");
        finish();
    }

    @Override
    public void onSubscriptionFailure(CFErrorResponse cfErrorResponse) {
        Log.d("onPaymentFailure " + subsID, cfErrorResponse.getMessage());
        finish();
    }

    public void doSubscriptionCheckoutPayment() {
        if (subsID.equals("ORDER_ID") || TextUtils.isEmpty(subsID)) {
            Toast.makeText(this, "Please set the subsId", Toast.LENGTH_SHORT).show();
            finish();
            return;
        }
        if (subsSessionID.equals("SUBS_SESSION_ID") || TextUtils.isEmpty(subsSessionID)) {
            Toast.makeText(this, "Please set the subs_session_id", Toast.LENGTH_SHORT).show();
            finish();
            return;
        }
        try {
            CFSubscriptionSession cfSession = new CFSubscriptionSession.CFSubscriptionSessionBuilder()
                    .setEnvironment(cfEnvironment)
                    .setSubscriptionSessionID(subsSessionID)
                    .setSubscriptionId(subsID)
                    .build();

            CFSubscriptionPayment cfSubscriptionPayment = new CFSubscriptionPayment.CFSubscriptionCheckoutBuilder()
                    .setSubscriptionSession(cfSession)
                    .setSubscriptionUITheme(new CFWebCheckoutTheme.CFWebCheckoutThemeBuilder()
                            .setNavigationBarBackgroundColor("#d11b1b")
                            .build())
                    .build();
            CFPaymentGatewayService gatewayService = CFPaymentGatewayService.getInstance();
            gatewayService.doSubscriptionPayment(SubscriptionCheckoutActivity.this, cfSubscriptionPayment);
        } catch (CFException exception) {
            exception.printStackTrace();
        }
    }
}

Github Sample

Step 4: Confirming the Payment

After the payment is completed, you need to confirm whether the payment was successful by checking the subscription status. Once the payment finishes, the user will be redirected back to your activity to your implementation of the CFSubscriptionResponseCallback interface.

You must always verify payment status from your backend. Before delivering the goods or services, please ensure you call check the subscription status from your backend. Ensure you check the subscription status from your server endpoint.

Testing

You should now have a working checkout button that redirects your customer to Telr Subscription Checkout. If your integration isn’t working:

Open the Network tab in your browser’s developer tools.
Click the button and check the console logs.
Use console.log(session) inside your button click listener to confirm the correct error returned.

Other Options

(Optional) Enable logging to debugging issues

To enable SDK logging add the following to your values.xml file.<integer name="cashfree_pg_logging_level">3</integer>Following are the Logging levels.

VERBOSE = 2
DEBUG = 3
INFO = 4
WARN = 5
ERROR = 6
ASSERT = 7