Rev up your application with an API.

Let’s suppose you run a small logistics business. I’m sure that before starting out on delivery, you would estimate the distance between the delivery points. Instead of launching Google Maps each time, what if you could fetch the distance information from your existing logistics application? That’s exactly what an API does— it helps integrate your application with other applications, services, databases, and a lot more.

The term “integration” may sound scary if you’re new to building apps, but with Zoho Creator, all it takes is simple logic and a few lines of code.

In this post, we’ll take a look at how you can easily integrate Zoho Creator with the Google Maps Distance Matrix API. When a user enters the start and end points, the API provides the distance between them and an estimated travel time.

Before we get into the actual “How-to,” here are a couple of things you need to know.

API Key – The API key is a unique security code that is passed between the two applications. This allows the “called” application, (Google Maps, in this case) to recognize and authenticate the “calling” application (Zoho Creator).

API Call – You initiate an API call whenever you need access to the service you are calling. This API call is a request, constructed as a URL, along with the parameters you are passing and the API key. In the case of our logistics example, the parameters will be the delivery points.

You can find the key and the URL from the called application’s API documentation.

Now consider the example mentioned above. You run a logistics business, and before you transport goods from the source to the destination, you need to estimate the distance. Let’s see how we can use the key and the URL to build an API integration, so that we can calculate and display the distance from within your Zoho Creator application.

STEP 1 – Define the variables

In this step, we identify the required variables and assign values to them. In programming, variables are used to temporarily store data or values.

BaseURL – This variable will contain the Request URL to the called application.

Key – This variable will hold the API key value from the Google Maps documentation.

Origin, Destination – These two variables will hold the delivery points that the user enters.

Unlike the BaseURL and the Key, which are assigned specific static values, the Origin and Destination variables will change based on the user’s input. We use input.fieldname to dynamically assign values to the Origin and Destination variables.

STEP 2 – Make the API call

Making the API call usually involves combining or “concatenating” the variable defined above and the getUrl task. But using Zoho Creator’s Script Builder, all we need to do is drag and drop the “Call Function” task and fill in the required data.

STEP 3 – Fetch the distance from Google Maps

Zoho Creator supports a number of web data manipulation tasks that we can use to fetch data from other applications. This data is available in either the XML or JSON format.

XML and JSON are markup languages used to store and transport data on the web. These languages encode information and present it in both human-readable and machine-readable forms.

(You can find the XML or JSON document in the Google Maps API documentation.)

To fetch the distance from the Google Map’s JSON document, we use the ExecuteXML task, which executes an “Xpath.” So what is an Xpath? As you can see from the screenshot above, the JSON document is split into a number of “rows” which are further divided into “elements”. Each of these divisions is called a “node.” An Xpath traces a JSON document and identifies the ‘node, which contains the value we need, and returns it in a readable format.

We have fetched the distance from the JSON document based on the delivery points from the user. Now, we need to display the fetched data in the application.

STEP 4 – Display the distance in the application

There are two ways in which we can display the distance in Zoho Creator: Load it into a single line field or display it as an alert message.

With the growing number of cross-channel interactions, APIs help you gather data from different applications and automate more processes. Now that you have a good sense of what an API is and how it works, why don’t you go ahead and implement one in your application?