In this article, I’ll explain how to fix the GraphQL Error (Code: 401) while connecting your XM Cloud solution running on Docker.

Background

Sitecore has provided a starter kit for the XM Cloud development which is prepared and pushed to GitHub when you create and deploy the XM Cloud project. At some point during development, you need to connect the Experience Edge from your local to verify or test changes you made to the XM Cloud content. When we follow the documentation and run the JSS application through the following command, it works well, from the terminal.

npm run start:connected

However, the same application gives the following error when run from the docker.

Analysis

As mentioned above, then we ran the application from the local terminal it worked well and from docker, it fails with a 401 error.

The error itself speaks that it is facing an authentication error and not the connectivity to the Experience Edge endpoint.

So, the issue must lie with the API key setup. For local development, we use the API key created in the Sitecore and for connecting the Experience Edge, we use the API key generated through the portal or PowerShell.

Upon deep analysis of the usage of the API key, I found that the environment variable value set through the docker-compose file for the rendering container is taking precedence. Please refer to the below screenshots and the respective descriptions to get a better understanding.

In the .env or .env.local file, I’ve set the origin API key generated for the Experience Edge.

And the same key value is also set through the docker-compose file.

The variable value SITECORE_API_KEY_xmcloudpreview is set in the .env file available in the root folder of the project.

The same value you can see in the Docker inspect for the rendering container during it’s running state.

Solution

Once you remove the environment variable SITECORE_API_KEY from the docker-compose.overfide.yml file, and restart the docker environment, you will be able to connect and see the content from the Experience Edge connected from the JSS application running in the dockerized environment.

Hope this will save you time and you will be able to love the docker and should not say I hate docker!

When you initialize your XMCloud kit using init.ps1 script, it generates and sets the value for SITECORE_API_KEY_xmcloudpreview in the .env file and that value takes precedence over all other values set in the .env or .env.local file for the JSS application.