CMS

Using Angular in Sitecore RESTful API for the ItemService

As we’ve been seeing a lot of buzz regarding headless content management systems (CMSes)—which separate the creation and management of content. In alternative words, they will allow you to edit, store, and manage content instead of using the CMSes admin tool, we will be creating our own tool or web application to a developer/Content Author via  API (application programming interface).

Here I am using Angular JS 1.6 version to interact with our Sitecore 9,  below I will be showing how we can use RESTful API to interact with Sitecore.

Already we have documentation that Sitecore has provided for ItemService you can check over here

First of all, I have made a sample HTML application with angular js which is having login functionality here I am authenticating the login details with the users that are available in Sitecore.

Based on the user entered credentials we will be hitting Sitecore below REST API

http://sc9.sc/sitecore/api/ssc/auth/login

The ItemService  sends 200 (OK) when successful and 403 (Forbidden) when the login did not succeed

Initially, I have faced CORS (Cross-origin resource sharing) issue, with this link I can able to resolve the issue, later I have got the response as 200

After getting the response I have navigated the user to index home page, where the user can see the below actions that he can perform with Sitecore.

  • Get Child items
  • Create an Item
  • Edit an Item

 

Get Children Items:

for getting child items I have given REST API URL as below and I have pasted the sample response as well.

https://sc9.sc/sitecore/api/ssc/item/E3C8F5B5-785C-4EBB-B286-650C6BE2919E/children?database=master

Here is the Sample JSON response for above JavaScript

We can loop the JSON array and show required fields in our UI

Create an Item:

For creating the item we need to use the below REST API URL

https://sc9.sc/sitecore/sitecore/api/ssc/item/sitecore%2Fcontent%2Fhome%2fData

Here is the Sample JSON response for above JavaScript

Edit an Item:

for Editing Sitecore item I have given REST API URL as below and I have pasted the sample response as well.

https://sc9.sc/sitecore/api/ssc/item/4CF49FC3-78F1-417D-8E9A-2A24834453BD

After executing the above javascript we will get HTTP response code as 204. there is another response code as well that was mentioned on the Sitecore documentation for ItemService.

In the Similar manner, we can do for deleting Sitecore items, run a Sitecore query or Sitecore Search, As per my working with ItemService still its need to improve it’s OOB API calls to deal with getting  Users Data like Email Id, First Name and Last Name.

Overall ItemService in Sitecore can be used to interact with Sitecore Content and can do CRUD operation with non-CMS applications or plain HTML applications. Below is the Screenshot of my Angular UI application that is delaying with Sitecore.

 

Sitecore

Please let me know your thoughts on ItemService or any other things that I might help you in the comments section.

 

 

About The Author

Kalyan Thumu

Mr.Cool

Leave a Reply

*