Extension Pointers - JS SDK Series #5: Working with connectors via widgets using ZOHO.CRM.CONNECTOR

Extension Pointers - JS SDK Series #5: Working with connectors via widgets using ZOHO.CRM.CONNECTOR

Working with third-party applications enables seamless data synchronization through integration. A connector is one of the features available in Zoho CRM that's used to establish an integration. You can create connectors and add the necessary APIs required for your business needs in your extension. Authorizing the connector and invoking the necessary APIs are the two important steps that are needed to achieve your business functionality. We detailed the steps involved in creating a connector, adding APIs, and using Deluge tasks to invoke APIs in our earlier post.

In this post, let's see how you can authorize a connector and invoke the APIs from a widget, thereby performing your business functionality with a customized UI. The ZOHO.CRM.CONNECTOR JS SDK supports methods to authorize a connector and invoke an API.
  • Authorize - This method is used to prompt the connector authorization window of the integrated application.
  • Invoke API - This method is used to invoke an API associated with the connector to perform the required functionality through a widget.



Here, namespace refers to the namespace of the connector you want to authorize.

There are a few instances in which the authorize method can be used. For your reference, we list a couple of them below.
  • An extension's widget feature may involve certain third-party integrations via a connector. There may be situations where the user could skip authorizing the connector while installing the extension. During such events, developers can conveniently set up a verification mechanism to confirm that the authorization is being properly carried out by the user. This can be done by prompting the user for authorization, when required, from within the scope of the extension itself using the authorize SDK method in the widget.
  • Say that a user has revoked an extension's authorization of a third-party application as the extension is currently not in use. Later, when the user tries to use the extension, they can go ahead without worrying about authorization, because once the authorize SDK is used at the appropriate place, the user will be prompted for authorization while accessing the widget and they can go ahead and utilize the extension features.
Invoke API:

ZOHO.CRM.CONNECTOR.invokeAPI(nameSpace, data)

Here, namespace refers to the namespace of the connector API to be invoked, and data refers to the data object to be constructed and passed to the connector API.

Data Object

The dynamic data is represented by placeholders in the connector API.
ContentType - multipart for multipart request.
For a multipart request, provide the parts configuration details here.
To include a file in your multipart request.

Let's see an example of how the authorize and invokeAPI JS SDK methods can be used to establish an integration between Zoho CRM and Google Calendar from a widget.

Consider a simple scenario where a Zoho CRM user wants to create an event for a lead via a button on the lead's detail view page and the event has to be automatically created in the user's default Google Calendar for seamless synchronization.

  1. A connector called "GoogleEventscalendar" is created and an API called "CreateNewEvent" is added to the connector to insert a new event. Please refer to this post to learn the detailed steps involved in creating a connector and adding an API.
  2. The APIs request body is constructed with parameters for end date, start date, and summary of the event. The data for the parameters hold placeholders that represent the dynamic data that will be passed via javascript. To learn more about GoogleCalendar Events API, please refer here.


var EntityId;
var EntityName;
var recordInfo;
var emailid;

//Subscribe to the EmbeddedApp onPageLoad event before initializing the widget 

/*Prompts the authorization window of the "GoogleEventsCalendar" connector to establish integration between Zoho CRM and GoogleCalendar*/

/*To create an event by retrieving the input values of start date, end date, and summary and passing it as a constructed data set to the 'InvokeAPI' method*/


//Fetching the record details and retrieving the mail ID of the lead

//Retrieving the input values
var title=document.getElementById("summary").value;
var startdate = document.getElementById("startdate").value;
var enddate = document.getElementById("enddate").value;

//Constructing the data set
var x = {

//Invoking the 'CreateNewEvent' API by passing the constructed data set

3. In the above code snippet, the authorization window is prompted on the page load of the widget. 

Note: The ZOHO.CRM.CONNECTOR.authorize SDK works only in the production environment and cannot be tested in sandbox environment.

4. Once the authorization has been completed, the user can go ahead and create an event for the lead by providing the necessary input and clicking the Create Event button.

In a similar way, you can use the authorize method depending on your business requirements and invoke the APIs accordingly. We hope you found this information useful. Keep following this space for more inputs.