Integrating Cybersource

The following steps detail how to configure settings in your Cybersource dashboard to integrate with Storeganise. During this process you will generate several important data points that must be later shared with Storeganise support staff.

It is very crucial to save these data points in a separate document file while going through this process.

1. Connect to your dashboard https://{sub}.cybersource.com/ebc2/ where {sub} is your Cybersource account provided by your Cybersource contact with your credentials

2. Go to Payment Configuration > Key Management

https://{sub}.cybersource.com/ebc2/app/PaymentConfiguration/KeyManagement

• Click "+ Generate key"
• Choose REST - Shared Secret
• Click "Generate key" button and download the 2 keys shown:

API Key ID (Key)

API Secret Key (Shared Secret)

3. Go to Payment Configuration >  Secure Acceptance Settings

https://{sub}.cybersource.com/ebc2/app/PaymentConfiguration/SecureAcceptanceSettings

Create a Profile:

• Click '+ New profile'
• Enter a 'Profile Name' of your choosing
• Select 'Hosted Checkout'
• Enter your 'Company Name'
• Set 'Payment Tokenization' to ENABLED
• Click 'Submit'

While going through each tab below, you may need to scroll to the bottom of the page and click 'Save' before proceeding to the next tab.

• GENERAL SETTINGS
  • Integration methods: Hosted Checkout
  • Added Value Services: Payment Tokenization Enabled
• PAYMENT SETTINGS
  • Card Type: Click 'Add card type' and select a card type (e.g., Visa)
  • CVN: Toggle on 'CVN Display' and 'CVN Required'
  • Currencies: Select the currencies for your business
  • Scroll to the bottom and click 'Submit'
  • Repeat these steps for each desired card type
• SECURITY
  • Click 'Create key'
  • Enter a 'Key Name' of your choosing and click 'Create'
  • Copy and save the Secure Acceptance Access Key and Secure Acceptance Secret Key
• PAYMENT FORM
  • Payment Form Flow: Select 'Single Page Form'
  • Checkout Steps: Enable 'Billing Information'
  • Billing Information: Toggle on 'Display', 'Edit', and 'Require' for each of the following fields:
    • First Name
    • Last Name
    • Street Address 1
    • City
    • State (US/Canada)
    • Zip/Postal Code
    • Country
    • Email

• Order Review:
  • Shipping Information: Toggle on 'Display' and 'Edit'
• CUSTOMER RESPONSE
  • Transaction Response Page: 'Hosted By You'
  • URL: https://{sg-code}.storeganise.com/api/v1/billing/cybersource/callback where {sg-code} is your Storeganise account name
  • Custom Redirect After Checkout: set URL https://{sg-code}.storeganise.com/account/billing (this is the default redirect URL and also the cancel URL)

Once each tab is configured, make sure to click "Promote profile"

4. Once you have the following information:

• Environment (Test, Production or ProductionIndia)
• Merchant ID (found in a banner at the top of your Cybersource dashboard)
• Currency (currency code e.g. EUR)
• API Key ID
• API Secret Key
• Secure Acceptance Profile ID
• Secure Acceptance Access Key
• Secure Acceptance Secret Key

Go to https://onetimesecret.com/ and paste all of this information, ensuring it is clearly labeled, in the 'Secret content goes here....' field. Then click the 'Create a secret link*' button. Example below:

Once you have your unique secret link URL, please contact us at support@storeganise.com with this link and we will advise you on the next steps to complete the integration of your Storeganise instance with your Cybersource merchant.

Using Cybersource in a custom configuration

- GET /v1/billing/cybersource/sources - list available payment methods

- POST /v1/billing/cybersource/session - returns { action: String, data: Object } to be used in a form for starting the checkout flow, as shown below:

const session = await fetch('https://spaceup.storeganise.com/api/v1/billing/cybersource/session?successUrl=' + encodeURIComponent(location.href), {
  method: 'POST',
  // credentials: 'include', // if using cookies
  headers: { authorization: `Bearer ${accessToken}` },
}).then(r => r.json());
const form = document.createElement('form');
form.action = session.action;
form.method = 'POST';
form.append(
  ...Object.entries(session.data).map(([name, value]) => {
    const input = document.createElement('input');
    return Object.assign(input, { type: 'hidden', name, value });
  })
);
document.body.append(form);
form.submit();

Note: You must first have created a user account before attaching Cybersource cards using the above endpoints