Guide to Fixing the 'SSC API Key Required' Error while Testing GraphQL Queries from Sitecore 10.3 Using Postman

Guide to Fixing the 'SSC API Key Required' Error while Testing GraphQL Queries from Sitecore 10.3 Using Postman

Introduction

The new era of technology is now here and everything is supposed to be headless now. A headless Site is exactly what that means, a site with no head. In other words, the site can exists and doesn't matter on which container it exists. Therefore, you can create the same site in different applications, for example iOS, React, Angular, or Android phones. Now that Sitecore claims that it is headless, I decided to give it a try and test it out. If Sitecore is truly headless then there should be no problem with using Postman with a simple GraphQL query to get the items from the database. Also I am using Sitecore 10.3 with JSS Docker Container in order to perform the tests. If you want a guide on how to install Sitecore 10.3 with JSS on Docker containers click here .

The Challenge 

After you follow the steps from the post I linked above, you should be able to have a working Sitecore Environment. You should be able to create your own items on Sitecore. For the purposes of this blog post I started to create a Quiz app. But just to demonstrate how you should get the items from Sitecore, I will use my items created as an example. 

These are the items I created:

 

 

In this blog we will only focus on the folder Quizzes. And we will try to get the data from Postman. 

If you followed the steps correctly from this blog then you should be able to start a Postman query like I did.

Steps for creating a Postman GraphQL Query 

1. Download Postman
2. Create a new HTTP request
3. Select POST method
4. In postman url box copy the url as this https://{yourSitecoreHost}/sitecore/api/graph/edge in my case my URL is this https://www.headlessapp.localhost/sitecore/api/graph/edge. 
5. Select the body tab and Select GraphQL
6. Copy and paste the following code on the body of the postman request 

   query {
     item(path: "/sitecore/content/HeadlessApp/Content/Quizzes", language: "en") {
       id
       name
      
      
     }
   } 

7. And when you Send the request you will get the following error:

This means that the SSC API key is required. Luckily I found the problem to fix it. But first where do I get the SSC API key ?

Where to get the SSC API Key ?

You can get SSC API Key in Sitecore from here /sitecore/system/Settings/Services/API Keys/{yourApplicationName} in my case the path for sitecore item is /sitecore/system/Settings/Services/API Keys/HeadlessApp

You should have already a created Key. If not you can create one. Copy the Id of your key. Mine is {F025A57B-C02F-4959-9B3D-2D72F579656A}

After you have the id from sitecore go back to Postman, and click on the Headers tab and add the following:

Now when you send the code on Postman you should be able to get your Sitecore item. 

In the figure above we have a query syntax, which states that we are going to start a GraphQL query. Afterwards we are giving GraphQL the context that we are using an item which has a path of /sitecore/content/HeadlessApp/Content/Quizzes and the language "en" means we are getting the item in its english language version. After that we are adding the field names we are interested in getting, in this case id and name of the item. 

After we press send we get a JSON format of the item and the fields we wanted to obtain. This way we can get data to any application, and the data can be presented any way the application wants it to be presented. 

Conclusion

In Conclusion, Sitecore is a Headless CMS now. Proven that now with Postman I can get the data from the item is enough to start adding more applications. GraphQL is a smart way to get the items from Sitecore in order to get our data and the application can decide how to present this data however it pleases. I will create another blogpost to show you how you can get the item and its children. A must have for applications that rely on services. 

Happy Coding  !!!!