Kaizen 202 - Answering Your Questions | Testing and Using REST APIs in Widgets

Kaizen 202 - Answering Your Questions | Testing and Using REST APIs in Widgets



Hello Developers!

Welcome back to a fresh week of Kaizen! 

Thank you for your active participation in sharing feedback and queries for the 200th milestone. This week, we will look at the following queries related to widget:
  • Widget Testing 
  • Using REST API in Canvas Widgets: Make HTTP calls in widgets (e.g., to external tax or product APIs)
Here are the queries that we have already answered for you from this milestone:
  1. Kaizen #200 - Answering Your Questions | Token generation using the Python SDK
  2. Kaizen #201 - Answering Your Questions | Webhooks, Functions, and Schedules

Widget Testing

One of the queries we received was simply stated
Quote
Widget Testing
 without any specific context. Since the user has not provided detailed input, we are assuming this is about how to test a widget during development.

You can test your Zoho CRM widget locally using the Zoho CLI. Run the following command from the root directory of your widget project:

zet run

This launches the widget on a local server where you can validate the UI and functionality before pushing it live.


Since the localhost connection opens in a new tab and is not private, you will need to manually authorize it. 

Click Advanced, then choose Proceed to 127.0.0.1 (unsafe) to continue. 

Notes
Note

If your widget needs to access data from your Zoho CRM organization, such as fetching or updating records, it must be deployed within a Zoho CRM iframe. To do this, you should upload the widget through the Zoho CRM Widgets setup page.

We recommend using the sandbox environment in such cases before deploying the widget to your production environment.

Making HTTP Calls from Widget

Following is a query we received from a user:
Quote
Using REST API in Canvas Widgets: Make HTTP calls in widgets (e.g., to external tax or product APIs)
Yes. You can make HTTP requests to external services from any type of Zoho CRM widget using the ZOHO.CRM.HTTP object from the Widget JS SDK.

Canvas Widget - What's Supported? 

Though full widget support within Canvas is on our roadmap, currently, you can invoke widgets from a Canvas view using Client Script. This lets you render widgets inside fly-outs or pop-ups. Here is a quick start guide on how you can achieve it:

Create a Widget

1. Create a widget project and code your logic using Zoho CLI as explained in our widget help page.

2. In Zoho CRM Developer Hub, create a new widget and set the type as Button.



Create a Client Script

3. Navigate to Client Scripts in Developer Hub and click New Script.

4. You can create your script either in the Modules or Commands category based on your use case. 

For assistance, refer to the step-by-step guide on Creating Client Script and Commands.



In the Category Details section, ensure to select Canvas as the page type. Canvas views are supported in the following page contexts: List, Detail, Create, and Clone. 

Choose the one that aligns with where your widget needs to appear.


5. Here is the sample script to render widget in a pop-up. 

ZDK.Client.openPopup({
api_name: 'Canvas_Widget',
type: 'widget',
animation_type: 4, 
height: '450px',
width: '450px',
},
{
data: 'sample data to be passed to "PageLoad" event of widget'
}); 

Here is the sample script to render widget in a fly-out. 

ZDK.Client.createFlyout('myFlyout', { 
animation_type: 4, 
height: '600px', 
width: '500px'
}
);
ZDK.Client.getFlyout('myFlyout').open({ api_name: 'Canvas_Widget', type: 'widget' });

For detailed guidance, check out our Client API documentation on Pop-up and Fly-out.

You can also check out the Kaizen #99 on Rendering Widgets using Client Script for a detailed guide based on a real-time use case. 

Using REST APIs from External Applications

The ZOHO.CRM.HTTP object enables you to make secure API calls directly from the Zoho CRM widget. It acts as a proxy, routing requests through Zoho servers, which eliminates the need for external applications to support CORS.

While this SDK is primarily used for integrating third-party services, it also supports Zoho CRM API calls. This provides you with greater flexibility to:
  • Customize header and parameter structures
  • Maintain a consistent calling pattern for both internal and external APIs within the widget.
Here is a basic syntax of the SDK:

ZOHO.CRM.HTTP.<method>({
  url: "<request-url>",
  headers: {
       // Request headers as Key-value pairs
    "Authorization": "Bearer <token>" // example
  },
  params: {
    // Request params as Key-value pairs

   "ids": "1234567890" // example
  },
  body: "<stringified JSON>", // Required for POST, PUT and PATCH
})
.then(function(response) {
  console.log("Response:", response);
});

Supported Methods
  • ZOHO.CRM.HTTP.get({ ... })
  • ZOHO.CRM.HTTP.post({ ... })
  • ZOHO.CRM.HTTP.put({ ... })
  • ZOHO.CRM.HTTP.patch({ ... })
  • ZOHO.CRM.HTTP.delete({ ... })
For more detail check out the HTTP method section of JS SDK help page.

Samples using Zoho CRM Contact Roles API

Let us explore a complete CRUD (Create, Read, Update, Delete) example using Zoho CRM’s Contact Roles API.

These structures have to be used within the JS function where you are executing your code logic. 

POST Contact Roles


// Prepare the API request
        var request = {
          url: "https://www.zohoapis.com/crm/v8/Contacts/roles",
          headers: {
            Authorization: "Zoho-oauthtoken 1000.XXXXXXXXXXXXXXXXXXX265bcf20e4"
          },
          body: {
            "contact_roles": [
              {
                "name": "Sales Lead",
                "sequence_number": 1
              }
            ]
          }
        };
         // Make API call 
        ZOHO.CRM.HTTP.post(request).then(function(data) {
          console.log(data);
 })

GET Contact Roles


// Prepare the API request
var request = {
          url: "https://www.zohoapis.com/crm/v8/Contacts/roles",
          headers: {
            Authorization: "Zoho-oauthtoken 1000.XXXXXXXXXXXXXXXXXXX265bcf20e4"
          }
        };
        // Make API call 
        ZOHO.CRM.HTTP.get(request)
          .then(function(response) {
 console.log(response);
})

UPDATE Contact Roles

// Prepare the API request
        var request = {
          headers: {
            Authorization: "Zoho-oauthtoken 1000.XXXXXXXXXXXXXXXXXXX265bcf20e4"
          },
          body: {
            "contact_roles": [
              {
                "name": "Evaluator",
                "id": "5545974000000006871"
              }
            ]
          }
        };
        // Make API call 
        ZOHO.CRM.HTTP.put(request).then(function(data) {
          console.log(data);
 })

DELETE Contact Roles


// Prepare the API request
        var request = {
          params: {
            ids: "5545974000002617002"
          },
          headers: {
            Authorization: "Zoho-oauthtoken 1000.XXXXXXXXXXXXXXXXXXX265bcf20e4"
          }
        };
        // Make API call 
        ZOHO.CRM.HTTP.delete(request).then(function(data) {
          console.log(data);
 })

We hope you found this post useful. 

Let us know if you have any questions in the comments or drop us an email at support@zohocrm.com.

Cheers!

------------------------------------------------------------------------------------------------------------------------

Related Reading


------------------------------------------------------------------------------------------------------------------------

    • Sticky Posts

    • Kaizen #197: Frequently Asked Questions on GraphQL APIs

      🎊 Nearing 200th Kaizen Post – We want to hear from you! Do you have any questions, suggestions, or topics you would like us to cover in future posts? Your insights and suggestions help us shape future content and make this series better for everyone.

    • Kaizen #198: Using Client Script for Custom Validation in Blueprint

      Nearing 200th Kaizen Post – 1 More to the Big Two-Oh-Oh! Do you have any questions, suggestions, or topics you would like us to cover in future posts? Your insights and suggestions help us shape future content and make this series better for everyone.

    • Celebrating 200 posts of Kaizen! Share your ideas for the milestone post

      Hello Developers, We launched the Kaizen series in 2019 to share helpful content to support your Zoho CRM development journey. Staying true to its spirit—Kaizen Series: Continuous Improvement for Developer Experience—we've shared everything from FAQs

    • Kaizen #193: Creating different fields in Zoho CRM through API

      🎊 Nearing 200th Kaizen Post – We want to hear from you! Do you have any questions, suggestions, or topics you would like us to cover in future posts? Your insights and suggestions help us shape future content and make this series better for everyone.

    • Client Script | Update - Introducing Commands in Client Script!

      Have you ever wished you could trigger Client Script from contexts other than just the supported pages and events? Have you ever wanted to leverage the advantage of Client Script at your finger tip? Discover the power of Client Script - Commands! Commands

    • Recent Topics

    • Out of Office not working

      I have set up out of office on zoho mail, however, it does not reply to every mail sent to it. I have tested it by sending several test messages from multiple different email accounts, I will get a response to some of them, but not all of them this is

    • Error message that says only images and no text

      I filled out a template for a weekly newsletter with text and images throughout but when I click save and next an error message comes up that says "Campaign content has only images and no text" which is not true at all. I have no idea how to fix this issue and don't know where the problem is. 

    • Contacts Don't Always Populate

      I've noticed that some contacts can easily be added to an email when I type their name. Other times, a contact doesn't appear even though I KNOW it is in my contact list. It is possible the ones I loaded from a spreadsheet are not an issue and the ones

    • Cannot add zoho email to gmail acc

      I'm trying to set up my zoho mail to connect to my gmail acc but no matter what I try I always get this problem. What should I do now? Password is up-to-date. Authentication failed. Please check your username/password. [Server response: 535 Authentication

    • 553 Relaying disallowed - Invalid Domain

      I have this error "553 Relaying disallowed. Invalid Domain" when sending an email to any email address. But I still receiving email from other emails. I checked MX, DKIM, SPF and it's ok. Could you check and help? Thanks

    • Turn off Organization Contact List

      We need to be able to turn off the Organization Contact list for some of our staff. Once the Organization Contact list is turned off for a user, we would then like to be able to create a list of contacts on per user basis that would not be editable by

    • Unable to send massage Reason 553/ Relaying Disallowed. Invalid Domain

      Cant sed massages from my email. All massages from my domain received the same issue Unable to send massage Reason 553/ Relaying Disallowed. Invalid Domain

    • Kaizen #194 : Trigger Client Script via Custom buttons

      Hello everyone! Welcome back to another interesting and useful Kaizen post. We know that Client Scripts can be triggered with Canvas buttons and we discussed this with a use case in Kaizen#180. Today, let us discuss how to trigger Client Script when a

    • Make record entry more organized with the Sections component in Wizards

      Hello everyone! Wizards in Zoho CRM have always helped you break long record-detail pages or large sets of fields into multiple screens, making data entry smoother and more user-friendly. Now, we’re taking a major step forward with a new Sections component—giving

    • GSTIN Public Search API

      Does zohobooks have an api using which i can search GST numbers and get their details?

    • External @zoho.com mail stopped working today, yesterday no issues

      Hello, Over a sudden mail stopped being delivered to inbox. Domain is standard zoho.com worked no problem yesterday, today nothing in inbox. Sent several test emails from corporate account & from gmail.com, logs show acceptance by zoho mail server, but

    • Suggestion: Smart Purchasing Module for Zoho Inventory and Zoho Books

      Suggestion: Smart Purchasing Module for Zoho Inventory and Zoho Books As an active user of Zoho Inventory and Zoho Books, I’ve noticed that the suite already provides valuable tools for managing inventory, analyzing trends, and processing purchase orders.

    • Adding bank details to the contact through API

      How to add bank-related information to the contact while creating it using API? The account number needs to be encrypted before sending it through API but not sure how to encrypt and get those values. Please guide me in this.

    • average cost display

      Hello there, I'm using the average cost valuation method, and the cost price shown in the Items menu should reflect the latest WAC (Weighted Average Cost). However, it doesn't update automatically. Is there a way to display the current average cost without

    • Apple Mail issues

      Dear Sir or Madam, I am trying to configure my Zoho mail account to Apple Mail. It is not working. It seems to need more information (perhaps a path prefix?) than is shown in your tutorial (<www.zoho.com/mail/help/apple-mac-imap.html>). After plugging

    • Assistance Required for Migrating Data from Odoo Inventory to Zoho Inventory

      Hi Team, I previously used Odoo Inventory to manage my stock and transactions, and I’ve now moved to Zoho Inventory. I’d like to migrate my data from Odoo—including product details, stock, purchase, and vendor information- into Zoho Inventory for continuity

    • I need my entire Zoho Account (mail/organization) deleted!

      Hey! I used zoho for my email aaron@aaronglass.me with domain forwarding/mx all that. I got rid of the mx info on my godaddy account and still Google won't let me sign up with my aaron@aaronglass.me email. (I'm moving to Google for business) SO! I was

    • Error: "Invalid Element warehouse_id" when sending order to Zoho

      i'm getting the error "Invalid Element warehouse_id" when trying to send an order to Zoho via API. Has anyone faced this issue before? How can I fix it?

    • No way to sell individual and case units smoothly in Zoho

      Currently, Zoho Inventory handles inventory primarily at the case level, which can be challenging for businesses that frequently need to break down cases into individual units for retail sales or smaller shipments. Although Zoho Inventory currently supports

    • How to handle multiple languages (Resume parser, Job opening, job board, career site) ?

      We are looking to bring Zoho Recruit to a market that needs to support 2 languages. The first thing we need to make sure is that the Candidate be flag with the language they speak. This is easy enough make a custom field that as the desire languages.

    • Shipping Labels

      Hi, Can we generate Packing Labels for manual shipping same as the format as Airway Bill in zoho books or inventory?

    • Unit Measurement Sign,

      Dear Zoho Support Team, I hope you are doing well. We recently purchased Zoho Inventory based on recommendations of your team that “it would be a great fit for our Shopify operations”. However, we are currently facing several urgent issues that require

    • Leadchain into a custom module

      Hello ZOHO Community ! is it possible to put the leads collected by leadchain into a custom module instaed of leads module ? Best wishes Niels

    • Urgent: How to Bulk Upload Images in Zoho Inventory? Any Workarounds?

      We are currently onboarding 5,000+ items from Shopify into Zoho Inventory, but we’re struggling with the lack of a bulk image upload feature. Right now, we have to manually upload and assign images one by one, which is extremely time-consuming and inefficient.

    • Can I automatically update COGS and Inventory account when creating an item?

      I have been trying to get Zoho to update the other two fields when I update one (Sales Account, COGS account, and Inventory Account). I know this seems like not a huge time saver, but I am all about efficiency and being an independent taproom, I create

    • I'm looking for a Microsoft List alternative in Zoho One to manage large lists of repetitive tasks

      I've used Microsoft Lists to manage lots of tasks that need to be completed several times for different users. We started with a large spreadsheet and then discovered lists, which worked pretty well. I was wondering if there is a similar products in Zoho,

    • Zoholics Europe and UK Awards 2025: Honouring our loyal customers!

      We're excited to announce that at this year's Zoholics events across Europe, we're holding customer awards for the first time ever! This is your chance to shout about the amazing things you've created, connected, or achieved with Bigin! And if you win,

    • Fillable template with dynamic tables?

      Is there a way to build a fillable template so that users can add rows to a table? To describe what I'm trying to accomplish the table has 3 sections; a header row, some number of rows with custom information, and a summary row with totals. I can't figure

    • How to store API keys in zoho?

      Hi everyone, I'm currently building an integration using Zoho Flow and I need to securely store several API keys that will be used to make external service calls from my flows. I would not like to hardcode the values in the code of custom function. What's

    • Zoho RPA is now available in your Zoho One bundle!

      Hello All! Of late, it's been quite a stint of new app integrations in Zoho One. This announcement pertains to the addition of another Zoho application, the most sought-after Zoho RPA - Robotic Process Automation, to the bundle. What is Zoho RPA? Zoho

    • is there an easy way to embed a zoho analytics report into a widget (or inside the "account" page) of Zoho CRM

      Hi, I have built a report that is specific to an account in Zoho CRM but I would like this to be built into the Zoho CRM front-end. I have looked at the widget concept but it seems quite complicated (see attached screenshot but I need to filter this view

    • Bigin iOS app update - Introducing Card Scanner and initiating WhatsApp conversations using pre-approved templates.

      Hello everyone! In the latest iOS (v1.11.3) version of the Bigin app, we have introduced the following features: Card Scanner Initiating WhatsApp conversations. Card Scanner: Our new Card Scanner feature extracts contact information from business cards.

    • Introducing card scanner in Bigin Android app

      Hello everyone! We are excited to introduce the card scanner feature on the latest Android version(1.7.26) of the Bigin app as well. Card scanner extracts contact information from business cards and allows you to save them as contacts in Bigin. You can

    • Full RTL and Hebrew Translation Support for Zoho Creator User Portal (Including All System Pages, Templates, and MFA Screens)

      Dear Zoho Creator Team, We kindly request comprehensive support for right-to-left (RTL) languages, particularly Hebrew, across the entire Zoho Creator user portal. This includes system-generated pages, templates, and multi-factor authentication (MFA)

    • ZUG real estate virtual meetup 2025: Sign documents, collect payments, and automate workflows with Zoho Sign

      Hi there! Are you in real estate and looking for a secure, compliant way to manage all your paperwork? In such a fast-paced industry, timing, compliance, and client trust are everything. Handling paperwork has always been a challenge, whether you're finalizing

    • OCR (Optical Character Recognition), automatisation des PDF et autres améliorations de Zoho RPA

      Zoho RPA est une plateforme d'automatisation des processus robotiques conçue pour accélérer et simplifier vos workflows. Elle permet de connecter facilement vos applications cloud à vos systèmes existants, même ceux qui ne disposent pas d’API, afin d’automatiser

    • 📞 Call + 💬 WhatsApp + 📲 SMS in Zoho CRM – All in One Place!

      We’re excited to introduce HelloSend, a powerful communication extension for Zoho CRM that brings SMS, WhatsApp, and Voice Calling directly into your CRM workspace. Whether you're in sales, support, or service delivery, HelloSend helps you connect with

    • Automation#24: Auto-Update custom field from Accounts to Tickets

      Hello Everyone! Welcome back to the Community Learning Series! This episode dives into how Zylker Techfix streamlines account-related ticket references. Previously, employees had to manually check account details to retrieve specific customer information,

    • Product Updates in Zoho Workplace applications | May 2025

      Hello Workplace Community, Let’s take a look at the new features and enhancements that went live across all Workplace applications this May. Zoho Mail Increased Preset Limit for Reminder and Snooze Options Preset limits for the Reminder and Snooze options

    • Outlook 365 ('classic') won't connect to Zoho email

      New computer, fresh install of Office desktop. On the old computer Outlook was working fine with Zoho, retrieving/sending mail, etc. On the new one I can't connect the accounts in Outlook--Outlook just keeps popping up the box asking for a password. All

    • Next Page