Vue Storefront is now Alokai! Learn More
Commercetools: Configuration

Commercetools: Configuration

Adyen Commercetools Integration Configuration Options

Our Adyen commercetools has two parts: Middleware integration and SDK Module. See the configuration options for each below.

Middleware integration

Configuration interface

middleware.config.js
export interface MiddlewareConfig {
  ctApi: {
    projectKey: string;
    clientId: string;
    clientSecret: string;
    scopes: Array<string>;
    authHost: string;
    apiHost: string;
  };
  returnUrl: string | ((cart: Cart, payment: PaymentWithFields) => string);
  adyenApiKey: string;
  adyenMerchantAccount: string;
  adyenCheckoutApiBaseUrl: string;
  adyenCheckoutApiVersion?: number;
  userSessionCookie?: string;
  buildCustomPaymentAttributes?: ((params: BuildCustomPaymentAttributesParams) => Promise<Record<string, any>>) | ((params: BuildCustomPaymentAttributesParams) => Record<string, any>);
}

Configuration options:

Attributerequiredinfo
ctApi.projectKey✅ YesThe project key of your commercetools project.
ctApi.clientId✅ YesThe client ID of your commercetools API client.
ctApi.clientSecret✅ YesThe client secret of your commercetools API client.
ctApi.scopes✅ YesThe scopes of your commercetools API client. It must contain manage_payments and manage_orders.
ctApi.authHost✅ YesThe commercetools authorization endpoint.
ctApi.apiHost✅ YesThe base URL of the commercetools API. It should contain only the base URL, without the path to the GraphQL endpoint. For example, https://<SHOP_DOMAIN>.com/ instead of https://<SHOP_DOMAIN>.com/vsf-ct-dev/graphql.
returnUrl✅ YesThe URL to which the shopper is redirected after the payment.
adyenApiKey✅ YesYour Adyen API Key
adyenMerchantAccount✅ YesThe merchant account identifier you want to use for processing payments.
adyenCheckoutApiBaseUrl✅ YesFor sandbox, it has to be https://checkout-test.adyen.com, and for live it has to be https://{PREFIX}-checkout-live.adyenpayments.com/, you can read more about it here - use only base URL from the linked document.
adyenCheckoutApiVersion⌥ optionalThe version of the Adyen Checkout API, by default it's 70.
userSessionCookie⌥ optionalName of the session cookie, by default it's "vsf-commercetools-token".
buildCustomPaymentAttributes⌥ optionalFunction returning object that will be assigned to the payload sent to the Adyen's POST /sessions endpoint.

Example configuration for Commercetools

middleware.config.js
const middlewareConfig = {
  // ...
  adyen: {
    location: '@vsf-enterprise/adyen-commercetools-api/server',
    configuration: {
      ctApi: {
        apiHost: '<CT_HOST_URL>',
        authHost: '<CT_AUTH_URL>',
        projectKey: '<CT_PROJECT_KEY>',
        clientId: '<CT_CLIENT_ID>',
        clientSecret: '<CT_CLIENT_SECRET>',
        scopes: ['manage_payments:<ADYEN_PROJECT_IDENTIFIER>', 'manage_orders:<ADYEN_PROJECT_IDENTIFIER>']
      },
      adyenMerchantAccount: '<ADYEN_MERCHANT_ACCOUNT>',
      adyenCheckoutApiBaseUrl: 'https://checkout-test.adyen.com',
      adyenApiKey: '<ADYEN_API_KEY>',
      returnUrl: 'http://localhost/adyen-redirect-back'
    }
  },
}