Setting Up API Access

This guide covers how to set up a B2C Commerce instance to access the APIs required by a PWA Kit storefront.

Repeat these instructions for each B2C Commerce instance that is used with PWA Kit.

Before You Begin

This guide assumes that someone on your team has already created a B2C Commerce instance, such as an on-demand sandbox, for use with PWA Kit.

Need an on-demand sandbox for development or testing? Get help on the B2C Commerce Infocenter: Get Started with On-Demand Sandboxes. A more detailed Trailhead module is also available: Salesforce B2C Commerce On-Demand Sandboxes.

To make it easier to complete all the tasks described in this guide (and subsequent guides), have the following pieces of information about your B2C Commerce instance ready. The Commerce API Configuration Values guide describes each item and explains where to find them.

  • Realm ID
  • Instance ID
  • Short code
  • Organization ID

Create an API Client

To enable your PWA Kit storefront to access both the Salesforce Commerce APIs and Open Commerce APIs (OCAPI), you must create an API client in Account Manager. To use Account Manager, you must be a B2C Commerce customer or partner (SI or LINK) user. Not all Account Manager users can create API clients. If you don’t have sufficient access, contact the B2C Commerce administrator on your team. Ask them to add the Sandbox API User role to your account or have them create the API client for you.

Start by creating an API client and assigning the correct role to it:

  1. Log in to Account Manager.
  2. Click API Client from the left navigation. If you don’t see the navigation link, you don’t have sufficient access to complete this task.
  3. Under Filter by Organization, select the organization that your instance belongs to.
  4. Click Add API Client.
  5. Enter a display name. Include the realm ID and instance ID to help you identify it later. Example: SCAPI and OCAPI client (xxxx_000).
  6. Generate a strong password and save it in a secure location (like LastPass).
  7. Enter the new password and confirm it.
  8. Go to the Organizations section and click Add.
  9. Select the organization that your instance belongs to.
  10. Click Add.
  11. Go to the Roles section and click Add.
  12. Under Salesforce Commerce API, check Salesforce Commerce API.
  13. To define the scopes for the Salesforce Commerce API role, click the filter button.
  14. Select the organization that your instance belongs to.
  15. In the search box, enter the first part of your instance hostname that includes your realm ID and instance ID. Example: xxxx-000.
  16. Select instance from the list of results.
  17. Click Add.

Next, go to the Open ID Connect section of the form and fill in the fields with some preconfigured values.

Copy the following values and paste them into the Default Scopes field:

Copy the following values and paste them into the Allowed Scopes field:

In the Redirect URIs field, add http://localhost:8080. This setting allows the sfcc-ci tool to work with your API client.

For the Token Endpoint Auth Method field, select private_key_jwt. For the Access Token Format field, select JWT.

To save the new API client, click Save.

The API Client listing appears again. Find your new API Client in the list. Filter the list by organization, if necessary.

Copy the value of the API Client ID column so that you can use it in the next set of instructions.

Set Up the Open Commerce API

For certain features, your PWA Kit storefront must make requests to the Open Commerce API (OCAPI) on your B2C Commerce instance.

Here’s how to set up OCAPI for PWA Kit using Business Manager:

  1. Log in to Business Manager on your B2C Commerce instance. If you can’t log in, contact the B2C Commerce administrator on your team for help.
  2. From the top navigation bar, click Administration.
  3. Click Site Development.
  4. Click Open Commerce API Settings.
  5. Copy the JSON from Appendix A of this guide.
  6. Go back to Business Manager and paste the JSON into the field.
  7. Replace the placeholder value for client_id with the value of the API client ID that you copied earlier.
  8. Scroll down to the bottom of the page.
  9. Click Save.

Set Up the Shopper Login and API Access Service

To authorize certain API requests on behalf of shoppers, PWA Kit relies on a Commerce API called the Shopper Login and API Access Service (SLAS). By default, requests to Salesforce Commerce APIs via SLAS are made through a proxy that is configured in package.json under the request path api. For this proxy configuration to work, you must use the SLAS Admin API to create a public client for your storefront.

Instructions for creating a public client for SLAS, and several prerequisite tasks, are listed in the SLAS Admin API Developer Guide. The SLAS Admin API Developer Guide also includes instructions for setting up an API client. But you can skip them if you’ve already created an API client using the instructions provided earlier in this guide.

When creating a public client using the SLAS Admin API, you must modify the sample request given in the SLAS Admin API Developer Guide. In the redirectURI array, include the callback URIs for all of your Managed Runtime environments. For example, if you have an environment called test and its hostname is shop.example.com, then you must include https://shop.example.com/callback in the redirectUri array. The array must include the callback URIs for all your other environments too.

Appendix A

Copy this JSON and paste it into the Open Commerce API Settings field in Business Manager. Go back to the instructions.