Skip to main content

Storefront API Configuration

A headless configuration needs to be configured for each shop that is used with the Headless API. The configuration disables all standard front-end functionality, such as PDP, PLP, basket, etc. It also sets some extra redirects where the webshop should redirect back to the Headless application.

To work with headless configurations, in the CloudSuite App go to Administration > Storefront API Configuration. An overview appears, listing all shops for which a headless configuration has already been defined. Double-click an existing configuration to open its details or click New to create a new one.

  • Select the Shop for which the Headless API is used.
  • In a production environment, Protect shop functionalities must always be checked; to avoid conflicts or unexpected flows.
  • Next to Headless Main URL, enter the URL on which the Headless application is served. This URL will be used when parts of the CloudSuite webshop are reached that shouldn't be accessible due to the Headless Configuration. For example, the homepage of the webshop should redirect to this URL; or when a PDP is called, it will also redirect to this URL.
  • Next to Headless Basket URL, enter the Basket URL where the Headless API redirects to. The webshop often redirects to the basket to require an action from the user. In this case, it will redirect to the basket of the external application, which integrates with Headless.
  • Next to Headless Confirmation URL, enter the URL of the Confirmation page to redirect to when a sale was successful. After the customer successfully finishes the checkout flow, a redirect to this URL will take place instead of showing the original confirmation page. It will have a query-parameter called sale_token, representing the customer's order. This token can be used in the external application to fetch all sorts of information about the sale to craft their confirmation page.

Prerequisites​

Before the headless configuration can have effect, the following requirements must be met:

  • The enterprise domain must be configured for the shop for which the Headless API is used.
  • 2 domains: 1 front-end and 1 for the domain on which the Headless E-commerce API runs (when the current shop does not run within an enterprise domain).
  • Must be activated: in the CloudSuite App go to Administration > User Interface > Features and check Headless E-commerce.
  • You need to write your own web app against the API to provide front-end functionality (Vue app or other web app). The Headless API is accessible at <client-domain>/<language-code>/api/v1/. With the Headless API activated, all webshop functionalities are accessible.
Last updated on