Connect to Adobe Commerce

This guide explains how to integrate the checkout starter kit with Adobe Commerce.

The adobe-commerce.js file provides a set of methods to interact with the Adobe Commerce instance. The client uses the Adobe Commerce HTTP Client, which is a wrapper around the Adobe Commerce REST API.

To use the Adobe Commerce HTTP Client, update COMMERCE_BASE_URL=<commerce_instance_url> in the .env file, and complete the authentication setup.

Authentication

Depending on your Adobe Commerce setup, there are two options to authenticate and communicate with App Builder:

• Configure Adobe Identity Management Service (IMS)

• Configure Commerce Integration

If a Commerce integration is detected, it has precedence over IMS authentication. However, if neither option is detected or configured, than client instantiation will fail.

Configure Adobe Identity Management Service (IMS)

IMS authentication requires the following setup:

1. Configure IMS for Commerce following the steps in Configure the Commerce Admin Integration with Adobe ID.

2. Create new IMS credentials through the Adobe Developer Console. Add a new API service in the workspace. From the list of APIs, select I/O Management API and follow the displayed steps. After adding the API, all credentials are generated.

3. Add a technical account with server-to-server credentials to the Commerce Admin with the appropriate permissions using the Admin User Creation Guide. If a technical account with appropriate permissions already exists, you can use it instead.

4. When associating the user with the account, find your Technical Account email as a part of generated IMS credentials with following pattern: <technical-account>@techacct.adobe.com and use that value in the Email field during user creation:

   

5. On the User Role tab, select the Administrators role to provide all necessary permissions.

6. Copy the generated credentials (client ID, client secret, technical account ID, and technical account email) to the .env file in the root of the project:

   Copy
   OAUTH_CLIENT_ID=<client id>
   OAUTH_CLIENT_SECRETS=<client secret>
   OAUTH_TECHNICAL_ACCOUNT_ID=<technical account id>
   OAUTH_TECHNICAL_ACCOUNT_EMAIL=<technical account email>
   OAUTH_SCOPES=<scope>
   OAUTH_IMS_ORG_ID=<img org>
   Copied to your clipboard
   OAUTH_CLIENT_ID=<client id>
   OAUTH_CLIENT_SECRETS=<client secret>
   OAUTH_TECHNICAL_ACCOUNT_ID=<technical account id>
   OAUTH_TECHNICAL_ACCOUNT_EMAIL=<technical account email>
   OAUTH_SCOPES=<scope>
   OAUTH_IMS_ORG_ID=<img org>

Create a Commerce integration

This option allows communication between Commerce and App Builder.

1. Create a new Adobe Commerce Integration by following the systems integration guide.

2. Copy the integration details (consumer key, consumer secret, access token, and access token secret) to the .env file in the root of the project.

   Copy
   COMMERCE_CONSUMER_KEY=<key>
   COMMERCE_CONSUMER_SECRET=<secret>
   COMMERCE_ACCESS_TOKEN=<access token>
   COMMERCE_ACCESS_TOKEN_SECRET=<access token secret>
   Copied to your clipboard
   COMMERCE_CONSUMER_KEY=<key>
   COMMERCE_CONSUMER_SECRET=<secret>
   COMMERCE_ACCESS_TOKEN=<access token>
   COMMERCE_ACCESS_TOKEN_SECRET=<access token secret>

Debugging requests

After following one of the connection options above, you can debug your application and access customized logs using the LOG_LEVEL environment variable. If this variable is set, logs from different phases of the commerce client display with detailed information.

Last updated 1/28/2025

Was this helpful?

Yes

No