Salesforce Commerce Cloud (REST) | Demo Developer Portal

Product Overview

With your Demo Developer Portal account, the Cyber source plugin for Salesforce Commerce Cloud makes the technical side of things far less complicated. This means you can help keep deployment time and disruption to a minimum and you can get up and running quickly.

Available in Professional, Enterprise, Unlimited and Developer Editions running SFRA 7.0 and below.

Integration Features:
- REST API
- Unified Checkout
- Microform (our solution for hosted fields)
- 3DSecure
Channels:
- eComm (CNP)
- inApp
Payment Methods:
- Visa
- MasterCard
- Maestro
- American Express
- Discover
- Diners
- JCB
- Apple Pay
- Google Pay
- Click to Pay
- eCheck
Alternative Payment Methods:
- China Union Pay
- J.Crew
- ELO
- Carte Bancaires
Payment Functions:
- Authorisation
- Sale
- Token Management Services (CIT only)
- Network Tokens
- Webhooks (Token Lifecycle Update)
Fraud Management:
- Decision Manager
- Device ID

Getting Started

Prerequisite - Salesforce – In order to use the Cyber source Storefront Reference Architecture cartridge please make sure you have an active instance of Salesforce and you have install and configure the SFRA app_storefront_base cartridge. This integration supports Storefront Reference Architecture (SFRA) v7.0.

For general information about Commerce Cloud and SFRA, see the Salesforce B2C Commerce Infocentre (salesforce.com).

Demo Developer Portal Prerequisites

You will be able to configure this integration to either Test or Production. If you do not yet have a live Demo Developer Portal account, or you wish to first test the integration, then creating a sandbox account will not only allow you to start programmatic integration but also provides access to the SMCC.

Generate REST Keys

Before configurating this integration, you are required to generate your REST keys within your SMCC for both (Live) and (Test)

Sign into your SMCC (Live) or (Test)
Access Payment Configuration -> Key Management
Select the 'Generate Key' button in the top right hand corner
Select your key type as 'REST - Shared Secret' and Generate Key
Copy your Shared Secret Key values and save them securely

Setup Workspace

Create a 'Cyber source' folder in your workspace and place the cartridge int_Cyber source_sfra (int_Cyber source for controller version) that was downloaded from the marketplace.

Note if you have a different project setup you will need to open the file /package.json and modify the paths.base value to point to your app_storefront_base cartridge. This path is used by the JS and SCSS build scripts.

If using VSCode, install the extension Prophet Debugger or any other SFCC extension and include the following in dw.json().

                {
  "hostname": "your-sandbox-hostname.demandware.net",
  "username": "yourlogin",
  "password": "yourpwd",
  "version": "version_to_upload_to",
  "cartridge": [
              "int_cybs_sfra",
              "int_cybs_sfra_base",
              "app_storefront_base",
              "modules"
  ]
}

Note if you are using a different IDE please refer to the respective developer guide to setup the workspace.

Build and Upload Code

Prerequisite: Install node under the Cyber source folder

Install sgmf-scripts and copy-webpack-plugin with the following command

                npm install sgmf-scripts && npm install copy-webpack-plugin

Compile the JS and SCSS code with the following command

                npm run compile:js && npm run compile:scss

Upload the code to your Salesforce Commerce Cloud instance

                
npm run uploadCartridge

Configure the Cartridge

Setup the Cartridge path

Navigate to Settings within Business Manager (Administration > Sites > Manage Sites > [your site] > Settings
For Cartridges enter int_cybs_sfra:int_cybs_sfra_base:app_storefront_base then select Apply.

Upload Metadata

Go to folder Cyber source/metadata/sfra_meta/sites/
Rename yourSiteID folder name to your site ID - this can be looked up in Administration > Sites > Manage Sites
Zip the payments_metadata folder
Upload the zip using Site Import & Export - Administration > Site Development > Site Import & Export
Import the uploaded zip file

Upon successful import the following metadata is created:

Site Preferences (Cyber source_Core, Cyber source_DeliveryAddressVerification, Cyber source_DeviceFingerprint, Cyber source_FlexMicroform, Cyber source_PayerAuthentication, Cyber source_TaxConfiguration, Cyber source_Tokenization, Cyber source_DecisionManager, Cyber source_MLE)
Service (PaymentHttpService)
Payment Processor (Payments_Credit)
Payment Method
Job (Payment: Decision Manager Order Update)

Navigate to Merchant Tools > Site Preferences > Custom Preferences > Cyber source Core and set values for the following parameters:

Enable Cyber source Cartridge - If disabled, none of the plugin services are invoked
Cyber source MerchantID - your Demo Developer Portal Merchant ID
Cyber source REST KeyId - the REST Key ID for your Demo Developer Portal account
Cyber source REST Secret Key - the REST Secret Key for your Demo Developer Portal account
Developer ID - leave this blank unless otherwise instructed.
CardTransactionType - Select Sale/Auth transaction type
CommerceIndicator - Select MOTO/Internet

Navigate to Administration > Operations > Services and click on the Payment Credentials of the service.

Make sure the URL is appropriate:
Test - https://apitest.Cyber source.com
Production - https://api.Cyber source.com

Configure Payment Methods

Navigate to Merchant Tools > Ordering > Payment Methods and select CREDIT_CARD to select the card capture method. Confirm that Payment Processor is listed as PAYMENTS_CREDIT before proceeding.

The Cyber source Cartridge supports the following payment card capture methods:
Microform v2
Direct Payment API

While this offers flexible integration options, we recommend utilising our Microform solution for capturing card details. This provides a full PCI-A Solution whilst offering flexibility around your chosen UI. This quick-start guide details the requirements to configure Microform. If you instead wish to use the Direct Payment API, please refer to the complete documentation.

To set Microform as the card capture mechanism, navigate to Merchant Tools > Site Preferences > Custom Preferences > Cyber source_FlexMicroform. Set the following values:

Enable Secure Acceptance - Flex Microform - set to Yes
AllowedCardNetworks - Configure from the following list the payment methods to accept:
                                                            VISA
                                                            MASTER
                                                          DISCOVER
                                                          DINERSCLUB
                                                          JCB
                                                          MAESTRO
                                                          AMEX
                                                          CUP
                                                          JCREW
                                                          CARTESBANCAIRES
                                                          ELO

Please note: While this integration has been developed by Visa Cyber source to enable the above payment methods, not all options will necessarily be active or available on your Demo Developer Portal account. Please review the Full Feature List at the top of this page to understand which Products and Services are available to you.

Configure Payer Authentication (3D Secure)

Payer Authentication is enabled by navigating to Merchant Tools > Site Preferences > Custom Preferences > Cyber source_PayerAuthentication and setting the following value:
Enable Payer Authentication - set to Yes
IsSCAEnabled - set to Yes

The use of Payer Authentication and on forcing an Authentication Challenge when storing card details (controlled by IsSCAEnabled) are mandated requirements for transactions in multiple regions. As such, these settings should be considered best practice. Please engage your local Demo Developer Portal representative for any questions.

Additional Feature Availability

If enabled on your Demo Developer Portal account, this integration can also be enabled to support Click to Pay, Apple Pay and Google Pay as payment methods; Decision Manager for fraud management capabilities; and TMS (Token Management Service) to securely tokenize cards, including the option for Network Token capabilities.

Please refer to the user guide available with the downloaded cartridge for full guidance on configuring all payment methods and features.

Ready to Go Live

When you are ready to go live, configure the cartridge using your production Demo Developer Portal account and key details.

Further Information

Need more guidance as you implement a Demo Developer Portal‑powered solution?
The Demo Developer Portal Developer Center offers resources to help merchants and system integrators build reliable, compliant, and well‑tested integrations.

• Explore Demo Developer Portal API documentation for payment processing, tokenization, refunds, and reporting to understand how each capability works within your ISV’s integration.
• Review SDK and code sample libraries to accelerate development and align with recommended implementation patterns.
• Access sandbox environment details to validate transaction flows, verify configuration, and complete end‑to‑end testing.
• Consult integration guides for information on authentication, security controls, risk services, and digital channel support.
• Use the Demo Developer Portal Support Center for troubleshooting articles, FAQs, and release updates relevant to your integration path.

These resources are designed to help you deploy and manage your ISV solution efficiently, ensuring a smooth payment experience for your customers.