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

    • Announcing the new SKILL.md for Zoho CRM and the updated OAS repository!

      We are introducing a new zoho-crm skill to make working with Zoho CRM Developer tools (like APIs, functions, widgets, client scripts, queries etc) easier and faster, with the help of AI in your preferred AI harness like Claude Code, Codex, Cursor, VSCode
    • Kaizen #256 - Build an Arrival Readiness Web Tab in Zoho CRM

      Hi everyone! Welcome back to the Kaizen series! In the post, we discuss a use case in hospitality industry: how an Arrival Readiness web tab widget can be used to let reception staff identify and resolve issues before arrival of guests. Use case In the
    • 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.
    • Kaizen #226: Using ZRC in Client Script

      Hello everyone! Welcome to another week of Kaizen. In today's post, lets see what is ZRC (Zoho Request Client) and how we can use ZRC methods in Client Script to get inputs from a Salesperson and update the Lead status with a single button click. In this
    • Kaizen #222 - Client Script Support for Notes Related List

      Hello everyone! Welcome to another week of Kaizen. The final Kaizen post of the year 2025 is here! With the new Client Script support for the Notes Related List, you can validate, enrich, and manage notes across modules. In this post, we’ll explore how
      • Recent Topics

      • Zoho Publish is now available in Zoho One!

        Hello Zoho One users, We’re excited to announce that Zoho Publish is now included as part of the Zoho One suite! As businesses grow, keeping their business information accurate across online platforms can become challenging. Updates may be missed, details
      • How do I add 2 agents under the same email?

        I have 2 agents who use the same email address. I added one, but when adding the second agent, it says that the email is already registered. How do I configure this properly?
      • Zoho Desk API modifiedTimeRange returns HTTP 500 around 2026-03-08T02:00:00.000Z

        Hello Zoho Support Team, We are experiencing a reproducible HTTP 500 Internal Server Error when querying the Zoho Desk API search endpoint with a specific modifiedTimeRange boundary. ### API Endpoint GET /api/v1/tickets/search ### Reproduction Steps &
      • Updating an Invoice Line Item's Discount Account via API Call / Deluge Custom Function

        I need help updating an invoice line item's discount account via API. Below is a screenshot of the line item field I am referring to. Now the field to the left of the highlighted field (discount account) is the sales income account. I am able to modify
      • Collaborate Visually with Whiteboard in Zoho Projects

        Whiteboard in Zoho Projects allows you to collaborate visually by creating diagrams, annotating designs, and sketching project workflows using shapes, text, and images within project modules. Team members can work simultaneously, improving productivity
      • Associate project with timer on iPhone

        When I start the timer without first associating a project (on my iPhone), its starts fine but now when I need to associate a project, and click on the link, I get a list of EVERY project I've ever put into Zoho Books. It used to just show active projects.
      • Sales Tax Refund on Commerce Order

        I've looked high and low. Relatively new to ZOHO but not to systems in general. How do we produce a refund for sales tax charged and paid for by a customer in error? This does not impact inventory stock. Simply for accounting and getting the $ back to
      • Importing Chart of Accounts from Quickbooks -- "Debit or Credit"?

        I'm trying to switch from QB to Zoho Books. I've prepped my chart of accounts and put it into the format following the structure of the sample CSV file. But one thing that does not exist at all on the Quickbooks side is the Zoho column for "Debit or Credit".
      • Long term pricing for customers managing multiple organizations

        I've been using Zoho extensively for quite some time and genuinely think it's one of the most powerful and customizable business platforms available. Between Zoho Books and Zoho Analytics, I've invested a significant amount of time building automations,
      • Default Status for Appointments to Completed

        We use Zoho Bookings integrated with Zoho Desk to book time for tech support sessions, we've configured it to only allow for a contact to book a single session to avoid customers overbooking time that may not be needed. The trouble is, once a session
      • Customer User Fields for use in Rules

        Hi, I would like to be able to add custom fields to the users, such as Department or Role, which can then be used in Rules, Reports, etc. as a condition. A use case is limiting Global lists or Choices based on the users Custom Field, so one form can be
      • Add ZeptoMail to Zoho One

        Hi Zoho Team, I would like to request that ZeptoMail be added as a fully included application within Zoho One. Why this is important Zoho One is positioned as a unified business operating system that brings the applications an organization needs under
      • Item image on document

        I know what I am asking may not be possible, but I will ask anyway, maybe I will get lucky, and someone else is doing it. My business is based on special orders only from various online stores. When I send a quote to a client, I generate a separate quote
      • Dashboard Metric Drill-Down Shows Stale Data

        Summary: When clicking between different metric components on a custom dashboard, the drill-down list shows data from the previously opened metric instead of the one just clicked. Steps to Reproduce: Create a custom dashboard with multiple pre-defined/templatized
      • Allow Reauthorizing CRM Connections Without Revoking First

        Currently, when a Zoho CRM connection needs to be reauthorized or authorized with another account, we first have to revoke the existing authorization and then authorize it again. This creates a gap where the connection is unavailable, and any functions,
      • Programmatic Itemized Expenses?

        It does not appear that it is possible to create itemized expenses programmatically (via the API)? Is this correct, or am I misunderstanding the situation?
      • Prefix & Suffix on Single Line, Number, etc.

        Hi, I would like to have the same Prefix and Suffix that was added to the Unique ID on Text and Number Fields. Use case could be as basic as temperature, as per another Idea I have to use Single Line (Text) for a number that might have leading zeros today,
      • Handle Leading Zeros in a Number Field

        Hi, If I use a Number Field, set with Min 7 Digits and Max 7 Digits, and enter 0000001, it will result in 1 and an error as it removes the leading zeros, the same with entering 0012340 will result in 12340 and error. So I have to use a Text Field and
      • Virtual Option for Fields

        Hi, I would like to be able to choose another option other than Read-Only or Disabled, such as Virtual. And with Virtual, the field is shown on the form and avilable in rules, but NOT saved to the Database. A use case is having multiple Large Lists of
      • Zoho Marketing Automation Cannot Sync Lookiup Fields

        Hello all, It seems that Zoho MA cannot sync Lookup fields from the CRM. Can you confirm if this is the case? Is there a workaround? Do you know if Campaigns can sync with custom modules and also with Lookup field in the CRM? Thank you!
      • Specific ListView Canvas on Canvas Home Page Always Loads Most Recent ListView, Not the One Specified

        I had mentioned this to ZOHO, but I mainly wanted to see if others in the Community are also facing this problem. I created a Canvas ListView for a Custom Module, and then created a Canvas Home page (technically on a tab item, but I'm not sure if that
      • Announcing the new SKILL.md for Zoho CRM and the updated OAS repository!

        We are introducing a new zoho-crm skill to make working with Zoho CRM Developer tools (like APIs, functions, widgets, client scripts, queries etc) easier and faster, with the help of AI in your preferred AI harness like Claude Code, Codex, Cursor, VSCode
      • Zoho Campaigns EU Topics API returns HTTP 200 with empty topicDetails

        Hello, Our Zoho Campaigns EU organisation has two custom topics visible in the Campaigns UI, and contacts are subscribed to them. However, an OAuth request with ZohoCampaigns.contact.READ to https://campaigns.zoho.eu/api/v1.1/topics returns HTTP 200 with
      • Caso de Éxito: Cómo Toyota Financial Services unificó la atención al cliente con Zoho

        "Después de seis meses con el CRM en producción estamos encantados." Miriam Cárdenas, Responsable Departamento ATC Toyota Financial Services es la división financiera de Toyota encargada de gestionar la financiación de vehículos y, junto con KINTO España,
      • Zoho Books - France

        L’équipe de Zoho France reçoit régulièrement des questions sur la conformité de ses applications de finances (Zoho Books/ Zoho Invoice) pour le marché français. Voici quelques points pour clarifier la question : Zoho Books est un logiciel de comptabilité
      • Automatically remove commas

        Team, Please be consistent in Zoho Books. In Payments, you have commas here: But when we copy and paste the amount in the Payments Made field, it does not accept it because the default setting is no commas. Please have Zoho Books remove commas autom
      • Zoho ERP | Product updates | July 2026

        Hello users, We're back with another round of updates to help you streamline your operations. This month's release brings new features and enhancements designed to help you work more efficiently. Read on to discover everything that's new in Zoho ERP this
      • Zoho CRM

        Cuándo voy a adjuntar un archivo .pdf en un registro en el campo Archivo obtengo el siguiente error:
      • Can I hide some products from a particular customer

        HI I want ot give a customer access to the portal but I need to hide some products from them that are not available for them to buy- is this possible ?
      • Dashboard/Component filter by probability

        Hi all Can I request the ability to add a Component or Dashboard filter for Deal Probability? Would be useful to be able to see data of deals more than 60% probable. Olly
      • Admin Logging in as another User

        How can a Super Admin login as another user. For example, I have a sales rep that is having issues with their Accounts and I want to view their Zoho Account with out having to do a GTM and sharing screens. Latest Update (27th April 2026): With the early
      • OpenAI Is Moving to the Responses API: Here's What It Means for SalesIQ

        OpenAI has deprecated its Assistants API and is moving to the Responses API. If you're using OpenAI Assistants with SalesIQ, you may be wondering if you need to make any changes to your existing setup. You don't. SalesIQ has already taken care of the
      • Free webinar: Zoho Sign for Microsoft apps

        Hello, Did you know Zoho Sign works right inside the Microsoft apps you already use? A signature request shouldn't mean leaving Teams for another tab, or downloading an Outlook attachment just to sign it. Zoho Sign integrates with Microsoft 365, Teams,
      • Billing Status and WO Status Field Colors -

        Hello Team, I noticed that the colors of the Billing Status and WO Status fields in the WO module have been changed. (Org ID:170000078905) This is not urgent to correct, but I wanted to bring it to your attention so you can check whether this is a system
      • Introducing throw statements in Deluge

        Hello everyone, We're introducing a powerful addition to Deluge that gives you more precise control over error handling in your scripts. Whether you're calling an external API, validating user input, or enforcing a business rule, there are moments when
      • Zoho Notebook、実はこんなところから使えます

        ユーザーの皆様、こんにちは。ゾーホージャパンの田村です。 前回に続き、今回もZoho Notebookをご紹介します。 関連情報 メモの保存場所、見直しませんか?― Zoho Notebookで始める情報管理 仕事中、「この内容、メモに残してあとで見返したいな」と思う瞬間はありませんか? 会議中の一言、お客様とのやり取り、CRMで見つけた気づき、 ほんの数秒で終わる内容だからこそ、「あとで書こう」と思って、そのまま忘れてしまうこともあります。 そこで今回は、PCやスマートフォンはもちろん、普段お使いのZoho製品からもすぐにアクセスできるノートアプリ「Zoho
      • I have been looking for CVID to get segmate list where & how can fnd it?

        I am trying to get segment details from the Zoho API. The API documentation says that the CVID is a mandatory parameter, but I cannot find the CVID in the "getmailinglists" API. Can you tell me where to find the CVID?
      • How do I increase the email attachment size in Zoho CRM ?

        It looks like I'm limited to 10MB when sending an attachment using the email widget on a record in Zoho CRM. Is there a way to increase the size? Or can I use some other tool? From what I'm reading online, I'm maxed out at 10MB. Any insight would be greatly
      • Introducing Incentives for Zoho CRM: Build, automate, and track sales commissions

        Dear Customers, We are here with an amazing news! We built a direct solution to help manage your commission provisioning activity in your business. From creating commission plans to issuing payouts, this application leverages your sales reps’ performance
      • Subforms and automation

        If a user updates a field how do we create an automation etc. We have a field for returned parts and i want to get an email when that field is ticked. How please as Zoho tells me no automation on subforms. The Reason- Why having waited for ever for FSM
      • Next Page