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:
- Kaizen #200 - Answering Your Questions | Token generation using the Python SDK
- Kaizen #201 - Answering Your Questions | Webhooks, Functions, and Schedules
Widget Testing
One of the queries we received was simply stated
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.
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:
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.
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' }); |
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
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
1. Widget - An Overview, CLI Installation, Working with Widgets, JS SDKs, Mobile Compatibility of Widgets and Kaizens
3. Canvas - Getting Started, Purpose and Benefits
------------------------------------------------------------------------------------------------------------------------
Previous Kaizen : Answering Your Questions | Webhooks, Functions, and Schedules | Kaizen Directory: Home
Access your files securely from anywhere
New to Zoho Recruit?
Zoho Developer Community
New to Zoho LandingPage?
Zoho LandingPage Resources
New to Zoho Survey?
New to Zoho CRM Plus?
Deliver unforgettable customer experiences
New to Zoho CRM Plus?
Deliver unforgettable customer experiences
New to Zoho Marketing Plus?
Everything you need to run your marketing
New to Zoho Marketing Plus?
Everything you need to run your marketing
New to Bigin?
Topic Participants
Kiruthiga G
Haiku Technical Support
Sticky Posts
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 howKaizen #217 - Actions APIs : Tasks
Welcome to another week of Kaizen! In last week's post we discussed Email Notifications APIs which act as the link between your Workflow automations and you. We have discussed how Zylker Cloud Services uses Email Notifications API in their custom dashboard.Kaizen #216 - Actions APIs : Email Notifications
Welcome to another week of Kaizen! For the last three weeks, we have been discussing Zylker's workflows. We successfully updated a dormant workflow, built a new one from the ground up and more. But our work is not finished—these automated processes areKaizen #152 - Client Script Support for the new Canvas Record Forms
Hello everyone! Have you ever wanted to trigger actions on click of a canvas button, icon, or text mandatory forms in Create/Edit and Clone Pages? Have you ever wanted to control how elements behave on the new Canvas Record Forms? This can be achievedKaizen #142: How to Navigate to Another Page in Zoho CRM using Client Script
Hello everyone! Welcome back to another exciting Kaizen post. In this post, let us see how you can you navigate to different Pages using Client Script. In this Kaizen post, Need to Navigate to different Pages Client Script ZDKs related to navigation A.
New to Zoho TeamInbox?
Zoho TeamInbox Resources
Zoho CRM Plus Resources
Zoho Books Resources
Zoho Subscriptions Resources
Zoho Projects Resources
Zoho Sprints Resources
Qntrl Resources
Zoho Creator Resources
Zoho CRM Resources
Design. Discuss. Deliver.
Zoho Show Resources
Get Started. Write Away!
Writer is a powerful online word processor, designed for collaborative work.
Zoho CRM コンテンツ
-
オンラインヘルプ
-
Webセミナー
-
機能活用動画
-
よくある質問
-
Ebook
-
-
Zoho Campaigns
- Zoho サービスのWebセミナー
その他のサービス コンテンツ
Nederlandse Hulpbronnen
ご検討中の方
Recent Topics
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[Webinar] A recap of Zoho Writer in 2025
Hi Zoho Writer users, We're excited to announce Zoho Writer's webinar for January 2026: A recap of Zoho Writer in 2025. This webinar will provide a recap of the features and enhancements we added in 2025 to enhance your productivity. Choose your preferredPicklist field shows "none" as default
Hello, Is there an option to avoid showing "none" as the default value in a picklist field? I also don't want to see any option displayed. My expectation is to have a blank bar, and then when I display the drop-down list, I can choose whichever I waStage-probability mapping feature in custom module
Hi, I'm building a custom module for manage projects. I would like to implement the stage-probability feature that Potentials has. Is this possible?Field Description is very small
Hello, The field Description in the activity is very small. Why don't try open a new window, or a bigger popup, or increase the width of the "popup". Example:StatusIQ
Please add StatusIQ to data sources. We using site24x7 and StatusIQ together and site24x7 integration is already there. Thanks and regards, TorstenIn Zoho People, the Operations buttons are frequently not visible or do not appear consistently.
In Zoho People, the Operations buttons are frequently not visible or do not appear consistently. We request you to please investigate and address this issue, as it is affecting daily HR operations and user access.Marketing Tip #14: Increase cart value with product bundles
Bundling products is a great way to increase average order value while giving customers more convenience. Think “camera + tripod + memory card” or “soap + lotion + bath salts.” Bundles make shopping easier and feel like a better deal. It’s a win-win forProblem with Workdrive folders
I'm having a problem a problem accessing files in a Zoho work drive folder when using the Zoho writer app. The problem folder appears grayed out in the Zoho work drive window in both the online and writer application. However I can open the folder inAdd RTL and Hebrew Support for Candidate Portal (and Other Zoho Recruit Portals)
Dear Zoho Recruit Team, I hope you're doing well. We would like to request the ability to set the Candidate Portal to be Right-to-Left (RTL) and in Hebrew, similar to the existing functionality for the Career Site. Currently, when we set the Career SiteAuto tracking URL generation based on Carrier
Hi, While creating a shipment order for a package in Zoho Books, I have a requirement that for example, if the carrier is Delhivery and tracking number is 1234, then can automatically the tracking link/URL be generated as www.delhivery.com/1234. Similary,Zoho Bookings form pre-filled with Zoho Forms in
Hi, I've got a contact page on my website and I'd like to have the option to book an appointment (redirected to zoho bookings page) after an option is submitted on the contact form. how would I go about doing this? thanksPre-orders at Zoho Commerce
We plan to have regular producs that are avaliable for purchase now and we plan to have products that will be avaliable in 2-4 weeks. How we can take the pre-orders for these products? We need to take the money for the product now, but the delivery willCustomer ticket creation via Microsoft Teams
Hi all, I'm looking to see if someone could point me in the right direction. I'd love to make it so my customers/ end users can make tickets, see responses and respond within microsoft teams. As Admin and an Agent i've installed the zoho assist app withinZoho Books' 2025 Wrapped
Before we turn the page to a new year, it’s time to revisit the updates that made financial management simpler and more intuitive. This annual roundup brings together the most impactful features and enhancements we delivered in 2025, offering a clearCan multiple agents be assigned to one ticket on purpose?
Is it possible to assign one ticket to two or more agents at a time? I would like the option to have multiple people working on one ticket so that the same ticket is viewable for those agents on their list of pending tickets. Is something like this currentlyEdit default "We are here to help you" text in chat SalesIQ widget
Does anyone know how this text can be edited? I can't find it anywhere in settings. Thanks!Can't change form's original name in URL
Hi all, I have been duplicating + editing forms for jobs regarding the same department to maintain formatting + styling. The issue I've not run into is because I've duplicated it from an existing form, the URL doesn't seem to want to update with the newFeature Request: Sync Leave Tracker to Zoho Mail / Calendar or provide option to download information
Zoho Leave Tracker offers the option to sync the leave Calendar to Microsoft 365 and Google Calendar. Adding an option to sync to Zoho-Mail Calendar would avoid duplication and add significant value for users. An alternative would be to allow users toCompensation | Salary Packages - Hourly Wage Needed
The US Bureau of Labor Statistics says 55.7% of all workers in the US are paid by the hour. I don't know how that compares to the rest of the world, but I would think that this alone would justify the need for having an hourly-based salary package option.Multiple currencies - doesn’t seem to work for site visitors / customers
I am trying to understand how the multiple currency feature works from the perspective of the website visitor who is shopping on my Zoho Commerce site. My site’s base currency is US Dollars (USD) but my store is for customers in Costa Rica and I wouldArchiving Contacts
How do I archive a list of contacts, or individual contacts?How do people handle using Outlook and Zoho Project calendar at the same time?
We have an ongoing problem in our organisation where we use Zoho Projects to plan all of our projects tasks and that also allows us to look forward using the workload report to see which of our consultants are overstretched etc and which are available.10GB Email Storage Limits in Zoho CRM
We’ve had Zoho One for almost 5 years and have always synced our emails from Gmail via IMAP… As of late, we’ve run into issues with our emails not syncing, due to being over the 10GB storage cap… What’s very odd is that we haven’t changed a thing? I knowPerformance is degrading
We have used Mail and Cliq for about three years now. I used to use both on the browser. Both have, over the past 6 months, had a severe degradation in performance. I switched to desktop email, which appeared to improve things somewhat, although initialHow to set page defaults in zoho writer?
hi, everytime i open the zoho writer i have to change the default page settings to - A4 from letter, margins to narrow and header and footer to 0. I cannot set this as default as that option is grayed out! so I am unable to click it. I saved the documentUnable to Send Different Email Templates for Different Documents in Zoho Sign
Hello Zoho Community, I am facing a limitation with Zoho Sign regarding email notifications sent to customers when a document is sent for signing. Currently, whenever I send any template/document for signing, the email notification that goes to the customerEnable History Tracking for Picklist Values Not Available
When I create a custom picklist field in Deals, the "Enable History Tracking for Picklist Values" option is not available in the Edit Properties area of the picklist. When I create a picklist in any other Module, that option is available. Is there a specific reason why this isn't available for fields in the Deals Module?ZO25: The refreshed, more unified, and intelligent OS for business
Hello all, Greetings from Zoho One! 2025 has been a remarkable year, packed with new features that will take your Zoho One experience to the next level! From sleek, customizable dashboards to an all-new action panel for instant task management, we’veVault crashes on Android Devices
Vault is continuously closing after entering the master password on my Android device. After several attempts I get a system message that says there is a bug in the app. I've uninstalled and reinstalled the app, and cleared the app cache, but nothing¿Cómo puedo configurar las contraseñas creadas bajo una directiva para que nunca caduquen y no aparezcan como caducadas en los informes?
¿Cómo puedo configurar las contraseñas creadas bajo una directiva para que nunca caduquen y no aparezcan como caducadas en los informes? La razón por la cual contraseña estas no deben caducar es porque su actualización depende de mi cliente y no de mí.Camera access
My picture doesn't appear in a group discussion. (The audio is fine.) The guide says "Click the lock icon on address bar," but I can't find it. Advise, pleaseAre static links available
I'm still using Zoho Meeting in trial mode. My previous webinar software provided a static link, and I made the mistaken assumption that I could send out my link and start a meeting later. Mass confusion, but my fault. With a paid version do you get aWhy is Zoho Meeting quality so poor?
I've just moved from Office 365 to Zoho Workplace and have been generally really positive about the new platform -- nicely integrated, nice GUI, good and easy-to-understand control and customisation, and at a reasonable price. However, what is going onHow to print a label from zoho creator app?
Hello, I would like to print a label from zoho creator app record similar to attached one. Size 74mm x 102mm. I tried record template. It leaves plenty of space around the content and also I couldn't set the height of the page. So it is not printing properly. Could someone please direct me to right direction for this requirement?Integration between "Zoho Sprints Stories" and "Zoho Projects Tasks/Subtasks"
We have two separate teams in our organization using Zoho for project management: The Development team uses Zoho Sprints and follows Agile/Scrum methodology. The Infrastructure team uses Zoho Projects for traditional task-based project management. InWhere can we specify custom CSS in Zoho Forms custom theme ?
I'm using a form with a dark theme. The OTP popup window is unreadable, because for some reason, the OTP popup background fixes color to white, but still takes the font color specified in the custom theme. This ends up as white on white for me, renderingTeam Gamification
Would love to motivate, engage and encourage our team with our social media posts. Would like to include Gamification features of Social Media in Zoho Social or Marketing Automation. And also bring in Social Advocacy tools/tracking/management to these,Sync Data from MA to CRM
Currently, it's a one-way sync of data from the CRM to MA. I believe we should have the ability to select fields to sync from MA to the CRM. The lead score is a perfect example of this. In an ideal world we would be able to impact the lead score of aUpdate CRM record action
Currently, MA only offers a "Push Data" action to push data to a CRM module. This action is built to cover the need to both create a new record and update an existing record. Because it has been implemented this way all required fields on the CRM moduleNext Page