CC Avenue Integration with Salesforce Commerce Cloud (SFCC)

Imagine you’re running an online store on Salesforce Commerce Cloud (SFCC) and want to make paying as smooth as swiping a card at your favorite café. That’s where CC Avenue, a popular payment gateway, comes in. Integrating CC Avenue with SFCC lets your customers breeze through checkout while you securely process payments—all without breaking a sweat!

In this guide, we’ll walk you through integrating CC Avenue with SFCC using a non-seamless process. From grabbing credentials to writing code and handling responses, I’ll break it down step by step with examples and tips. Whether you’re new to SFCC or a seasoned developer, you’ll leave ready to set this up. Let’s get started!

Why Integrate CC Avenue with SFCC?

SFCC is a powerhouse for building ecommerce sites, and CC Avenue is a trusted payment gateway in markets like India. Pairing them means:

• Smooth Payments: Customers pay quickly and securely.
• Flexibility: Supports multiple currencies and payment methods.
• Efficiency: Streamlines your checkout process.

But it’s not plug-and-play—you’ll need to configure settings, write some code, and test it out. Don’t worry; I’ll make it simple!

Step-by-Step Guide to CC Avenue Integration with SFCC

Here’s how to connect CC Avenue to SFCC using a non-seamless approach, where customers enter billing details on CC Avenue’s hosted page. Follow along, and you’ll have it running in no time!

Step 1: Obtain CC Avenue Credentials

Before you touch any code, you need the keys to the kingdom—your CC Avenue credentials.

What You Need

• Merchant ID: Your unique identifier with CC Avenue.
• Access Code: A code for secure API calls.
• Encryption Key (Working Key): A key to encrypt payment data.

How to Get Them

1. Sign up for a CC Avenue merchant account at ccavenue.com.
2. Log in to your dashboard.
3. Navigate to Settings > API Keys (or similar) to find your Merchant ID, Access Code, and Working Key.
4. Save these somewhere safe—you’ll need them soon!

Why It Matters

These credentials link your SFCC store to CC Avenue’s payment system. Without them, no payments can flow.

Step 2: Configure CC Avenue in SFCC Business Manager

Next, let’s tell SFCC about CC Avenue through its Business Manager—the control hub for your store.

How to Do It

1. Log In: Open SFCC Business Manager and sign in.
2. Navigate: Go to Merchant Tools > Site Preferences > Payment Methods.
3. Add Payment Method:

• Click “New” to create a payment method.
• Name it something like “CC Avenue.”

1. Enter Credentials:

• Fill in your Merchant ID, Access Code, and Encryption Key from Step 1.

1. Set Options:

• Payment Flow: Choose how payments fit into checkout (e.g., redirect to CC Avenue).
• Currencies: Select supported currencies (e.g., INR for India).
• Methods: Enable options like credit cards or net banking.

Why It’s Useful

This step connects SFCC’s checkout to CC Avenue, setting the stage for payment processing.

Pro Tip

Save your changes and test this setup later—missteps here can block payments!

Step 3: Set Up Payment Processing Pipeline

SFCC uses pipelines (or modern equivalents like cartridges) to handle checkout steps. You’ll need to tweak this to include CC Avenue.

How to Do It

1. Locate Pipeline: In Business Manager, go to Merchant Tools > Ordering > Payment Processors.
2. Add Processor:

• Create a new processor or edit an existing one.
• Link it to your “CC Avenue” payment method from Step 2.

1. Define Logic: Ensure it calls CC Avenue’s API at the right moment (we’ll code this next).

Why It Matters

This ties CC Avenue into SFCC’s order flow—without it, payments won’t process.

Note

If you’re using SFCC’s newer cartridge system, you’ll configure this in code (Step 4).

Step 4: Code Changes for Non-Seamless Integration

Now, let’s roll up our sleeves and write some code! We’re using CC Avenue’s non-seamless process, where customers enter billing info on CC Avenue’s page. Here’s how to make it happen.

Overview

• Handle Hook: Start the payment process in SFCC.
• Create Order: Generate an order from the basket.
• Build Payload: Prepare data for CC Avenue.
• Encrypt & Submit: Send it to CC Avenue’s API.
• Handle Response: Process the result.

Let’s break it down with code examples.

4a. Handle Hook & Order Creation

First, use SFCC’s checkout hooks to kick things off.

const COHelpers = require("dw/order/CheckoutHelpers");

// Handle hook to create payment instrument
function handle(basket) {
  const paymentInstrument = basket.createPaymentInstrument("CC_AVENUE", basket.totalGrossPrice);
  const order = COHelpers.createOrder(basket);
  return { order: order };
}

• What’s Happening: This creates a payment record and an order from the customer’s basket.

4b. Build the Payment Request Payload

Next, craft the data CC Avenue needs—like order details and addresses.

"use strict";

function PaymentRequest(order, merchantId, language, options) {
  const URLUtils = require("dw/web/URLUtils");
  const safeOptions = options || {};

  this.merchant_id = merchantId;
  this.order_id = order.orderNo;
  this.currency = order.currencyCode;
  this.amount = order.totalGrossPrice.value;
  this.customer_identifier = order.customer.ID;
  this.billing_email = order.customerEmail;
  const { billingAddress } = order;
  this.billing_name = billingAddress.fullName;
  this.billing_address = billingAddress.address1;
  this.billing_city = billingAddress.city;
  this.billing_state = billingAddress.stateCode;
  this.billing_zip = billingAddress.postalCode;
  this.billing_country = billingAddress.countryCode.value === "US" ? "United States" : "India";
  this.billing_tel = billingAddress.phone;
  const { shippingAddress } = order.defaultShipment;
  this.delivery_name = shippingAddress.fullName;
  this.delivery_address = shippingAddress.address1;
  this.delivery_city = shippingAddress.city;
  this.delivery_state = shippingAddress.stateCode;
  this.delivery_zip = shippingAddress.postalCode;
  this.delivery_country = shippingAddress.countryCode.value === "US" ? "United States" : "India";
  this.delivery_tel = shippingAddress.phone;
  this.language = language;

  this.redirect_url = safeOptions.redirectURL || URLUtils.abs("CheckoutServices-PlaceOrder").toString();
  this.cancel_url = safeOptions.cancelURL || URLUtils.abs("CheckoutServices-PlaceOrder").toString();

  this.toRequestString = function() {
    let string = "";
    Object.keys(this).forEach(key => {
      if (this[key] && typeof this[key] !== "function") {
        string += `${key}=${encodeURIComponent(this[key]).replace("%20", "+")}&`;
      }
    });
    return string.slice(0, -1); // Remove last "&"
  };
}

module.exports = PaymentRequest;

• What’s Happening: This builds a data packet with order info, billing/shipping details, and URLs for success or cancellation.

4c. Encrypt the Request

CC Avenue requires encrypted data for security. Here’s how to do it in SFCC.

"use strict";

const encryptionUtils = {};
const { Cipher, Encoding } = require("dw/crypto");
const preferences = require("*/cartridge/config/preferences");

function getKey(workingKey) {
  const { WeakMessageDigest } = require("dw/crypto");
  const { Bytes } = require("dw/util");
  return Encoding.toBase64(new WeakMessageDigest("MD5").digestBytes(new Bytes(workingKey)));
}

encryptionUtils.encrypt = function(plainText) {
  const workingKey = preferences.ccavenueWorkingKey;
  const iv = Encoding.toBase64(new require("dw/util/Bytes")("\x00\x01\x02\x03\x04\x05\x06\x07\x08\x09\x0a\x0b\x0c\x0d\x0e\x0f"));
  const cipher = new Cipher();
  const enKey = getKey(workingKey);
  return Encoding.toHex(
    Encoding.fromBase64(
      cipher.encrypt(plainText, enKey, "AES/CBC/PKCS5Padding", iv, 10)
    )
  );
};

encryptionUtils.decrypt = function(encryptedText) {
  const workingKey = preferences.ccavenueWorkingKey;
  const cipher = new Cipher();
  const key = getKey(workingKey);
  const iv = Encoding.toBase64(new require("dw/util/Bytes")("\x00\x01\x02\x03\x04\x05\x06\x07\x08\x09\x0a\x0b\x0c\x0d\x0e\x0f"));
  return cipher.decrypt(
    Encoding.toBase64(Encoding.fromHex(encryptedText)),
    key,
    "AES/CBC/PKCS5Padding",
    iv,
    10
  );
};

module.exports = encryptionUtils;

• What’s Happening: This encrypts your payload using AES with your Working Key.

4d. Prepare and Submit the Form

Now, send the encrypted data to CC Avenue’s transaction URL.

function getPaymentFormDetails(order, currentLanguage) {
  const encryptionUtils = require("*/cartridge/scripts/util/encryptionUtils");
  const PaymentRequestModel = require("*/cartridge/models/paymentRequest");
  const merchantID = preferences.ccAvenueMerchantID;
  const paymentRequest = new PaymentRequestModel(order, merchantID, currentLanguage);
  const paymentRequestStr = paymentRequest.toRequestString();
  const encryptedText = encryptionUtils.encrypt(paymentRequestStr);

  if (encryptedText) {
    session.privacy.orderToken = order.orderToken;
    session.privacy.orderNo = order.orderNo;
    return {
      paymentRequest: paymentRequest,
      encryptedText: encryptedText,
      accessCode: preferences.ccavenueAccessKey,
      transactionURL: preferences.ccAvenueTransactionURL
    };
  }
  return null;
}

// Client-side submission
function submitForm(transactionURL, encryptedText, accessCode) {
  const form = document.createElement("form");
  form.method = "post";
  form.action = transactionURL;

  const encRequestInput = document.createElement("input");
  encRequestInput.type = "hidden";
  encRequestInput.name = "encRequest";
  encRequestInput.value = encryptedText;
  form.appendChild(encRequestInput);

  const accessCodeInput = document.createElement("input");
  accessCodeInput.type = "hidden";
  accessCodeInput.name = "access_code";
  accessCodeInput.value = accessCode;
  form.appendChild(accessCodeInput);

  document.body.appendChild(form);
  form.submit();
}

// Example usage
const data = getPaymentFormDetails(order, "en");
if (data) {
  submitForm(data.transactionURL, data.encryptedText, data.accessCode);
}

• What’s Happening: This sends the customer to CC Avenue’s billing page in a new tab.

4e. Handle the Response

After payment, CC Avenue redirects back to your redirect_url (e.g., CheckoutServices-PlaceOrder). Decrypt the response and finish the order.

const encryptionUtils = require("*/cartridge/scripts/util/encryptionUtils");

function handleResponse(req) {
  const encryptedResponse = req.form.encResp; // CC Avenue sends this
  const decryptedResponse = encryptionUtils.decrypt(encryptedResponse);
  const responseParams = new URLSearchParams(decryptedResponse);
  const paymentStatus = responseParams.get("order_status");

  if (paymentStatus === "Success") {
    const orderNo = session.privacy.orderNo;
    const order = require("dw/order/OrderMgr").getOrder(orderNo);
    const paymentInstrument = order.getPaymentInstruments("CC_AVENUE")[0];
    paymentInstrument.paymentTransaction.transactionID = responseParams.get("tracking_id");
    paymentInstrument.paymentTransaction.paymentProcessor = require("dw/order/PaymentMgr").getPaymentProcessor("CC_AVENUE");
    require("dw/order/PaymentMgr").getPaymentProcessor("CC_AVENUE").authorize(order, paymentInstrument);
    require("dw/order/OrderMgr").placeOrder(order);
    return { success: true, redirect: "Order-Confirm" };
  }
  return { success: false, error: "Payment failed" };
}

• What’s Happening: Decrypts the response, checks if payment succeeded, authorizes it, and places the order.

Step 5: Document Everything

Don’t skip this! Write down:

• Credentials Used: Merchant ID, Access Code, etc.
• Custom Scripts: File names and locations.
• Settings: Business Manager configs.
• Troubleshooting Tips: Common issues and fixes.

Why It’s Useful

Future you—or your team—will thank you when something breaks!

Quick Reference Table

Important Notes

• Variations: Your setup might differ based on business needs (e.g., seamless vs. non-seamless).
• Updates: Check CC Avenue and SFCC docs for the latest APIs—things change!
• Experts: If you’re stuck, consult a developer familiar with SFCC cartridges.

Conclusion: Make Payments a Breeze

Integrating CC Avenue with SFCC might sound like a big job, but it’s just a few steps: grab credentials, configure SFCC, write some code, and handle the response. Once it’s running, your customers get a seamless checkout, and you get secure payments—all powered by JavaScript and SFCC’s flexibility.