CRM Customization using Web API with OData 4.0, Angular JS and Bootstrap

computer code

There are a number of ways Dynamics CRM functionality is extended, using workflows, server-side plugins, client-side development using Web APIs and Open Data Protocol (OData), web resources, etc. Depending on the business requirements, the correct technology can be picked for customization. Recently, I worked on a customization which provides insight on what’s happening in your CRM world. We called it ‘Latest News Grid’. It shows information about 4 things on the record – the latest email, phone call, appointment and task.

My choice of technology was client-side development using CRM 2016 Web API utilizing OData 4.0 with Angular JS. The customization was dropped in as a web resource inside CRM. In this blog, I am going to discuss why I picked these technologies and walk you through the Implementation. In addition, I will discuss a few technological terms that I learned along the way.

Design.

As the application only needed data in a read-only format, modifications to the data were not needed. There were no trigger points on which the data needed to be fetched. Generally, CRM plugins are used to run custom code where an event occurs such as when a new record is created or updated. Because of this, a plugin would be an overkill for this project.

CRM also provides web services called Organization Service (using SOAP) and Organization Data Service (using REST and OData 2.0) that lets us interact with CRM data. CRM OData endpoint only provides create, read, update, delete (CRUD) operations on entities. Complex operations using ‘execute’ cannot be performed. But starting CRM 2016, OData endpoint is deprecated, and it is encouraged to use CRM Web API. OData was never fully developed to do complex execute operations.

Web APIs are a REST implementation of fully functional SOAP based Organization Service. Eventually Web API will completely replace Organization Service and Organization Data Service and there will be just one WEB API interface. The decision was made, CRM Web API it is.

For GUI, I needed to make a http request and present the result in a nicely styled html format. Angular JS has a $Http library that lets you make a http request.

Now, let’s slice and dice some technical terms I used above.

What is REST?

REST is an architectural style which treats every server object as a resource which can be located by a unique resource identifier (URI). So, when you make a request (type a URL in the address bar), it knows exactly which server to go to and what resource to get. It is stateless as no information is retained in between requests, but each individual request has all the information needed. HTTP protocol conforms with all these rules and can be used as a synonym to REST. For getting CRM data, we pass a bunch of data requesting a resource and in return we get a bunch of data in a name-value pair called JavaScript Object Notation (JSON).

How to query CRM data using Web API?

This is part 2 in the CRM customization series where I am going to go through CRM OData endpoint, if you have not read part 1 then please click here.

Starting with CRM 2016 and Dynamics 365 (online and on-premise), Web API is the chosen way to integrate with CRM. Web API replaces the Organization service and implements OData 4.0in a RESTful way. Lets look at some technical stuff and then we will dive into getting the data for our ‘Latest News’ project.

What is OData?

OData is a protocol designed to query and consume REST APIs over HTTP. It is different than a plain web API endpoint in that it returns a collection of IQueryable (a collection that can be queried) instead of IEnumerable. Let’s say I built a WebAPI endpoint giving me back a list of customers. Now I want to filter out the customers whose name begins with ‘A’, so I must create a new endpoint. For every such request, there must be an endpoint serving it or we need to get all the customers and apply filtering at client side which is not very efficient. Wouldn’t it be nice if we had something like SQL, where we can define our SELECT, and WHERE clauses on the fly and the code runs at server side sending us our results. OData does exactly that. The syntax for building the query is very similar to SQL and is defined in OData OASIS standard. Here is an example of OData request which looks for a customer with name ‘ALLEN’

http://localhost/odata/Customer?$filter=Name eq ‘ALLEN’

How to query CRM Web API using OData?

Inside CRM, if you browse to Settings -> Customizations -> Developer Resources, you will find the service root url for Web API, it will look something like this –

https://[organization name]/api/data/v8.1/

The very first step is to form the request by appending entity types, conditions, filters, and such to the Web API url. For my project, I needed the latest information for a contact, and here is the request for it.

https://[organization name]/api/data/v8.0/contacts(908CC57E-B566-DC11-B3D3-0003FFC0F7B5)

Using relationships as defined in the metadata, I got all the emails for that contact using the ‘Contact_Emails’ relationship. By ordering the result in descending order and picking the very top record, I got the latest email for that contact. Here is the modified query fir it.

https://[ organization name]/api/data/v8.0/contacts(908CC57E-B566-DC11-B3D3-0003FFC0F7B5)/Contact_Emails/?$orderby=actualend desc&$top=1

Similarly, using other relationships such as ‘Contact_Task’, ‘Contact_Phonecalls’ and ‘Contact_Appointments’, I got the latest task, phonecall and appointment for that contact.

How to test results for Web API?

Web API query can be easily tested by pasting the url in a browser. Result comes back in JSON format. By default, the browser does GET http request which is what we want for retrieving data, but to do a POST, UPDATE or DELETE request, you will need a tool such as Fiddler, to manipulate the request type.

Now that we have the data that we need, in my next blog I will talk about the representation of our data. To represent data to the user, we need a GUI, my choice for this is Angular JS, and Bootstrap to pretty it up. More on this coming soon.

 

Are you looking for a managed service provider, business processes support, or Microsoft expertise? Contact KTL for CRM customizations, and any other kind of Business Solutions support.

Is Azure Right for You?

Fortune 500 companies rely on Azure for analytics, computing, database, mobile, networking, storage, and more.

Download Now