When should I use the REST API-based chat widget?

AskHandle offers two types of chat widgets:

• A WebSocket-based widget for real-time, live human chat
• A REST API-based widget for lightweight, customizable, AI-powered chat

This article explains when to use the REST API widget, how it differs from the default, and how to install and deploy it.

✅ Use the REST API Widget If:

• You're building an AI chatbot experience (no live agents)
• You want a lightweight, customizable widget
• You need complete control over hosting, style, and behavior
• You're working with static sites, headless CMS, or JAMstack
• You want to manage deployment for performance or branding

WebSocket vs. REST: Which Widget Should I Use?

Use the WebSocket widget if you're offering live chat with real human agents.

Use the REST API widget if you're building an AI-powered assistant that doesn't require real-time messaging.

How to Install and Deploy the REST API-Based Chat Widget

This step-by-step guide walks you through everything needed to:

1. Download the open-source widget
2. Customize it
3. Deploy it using Heroku, Render, or any Node.js host
4. Embed it in your website

Step 1: Download the Chat Widget Code

Clone the official GitHub repository:

BashCopy code

Step 2: Install Dependencies

Make sure you have Node.js v14 or higher:

BashCopy code

Step 3: Set Up Your API Token

Create a .env file in the project root with your AskHandle API token:

EnvCopy code

You can find this in the AskHandle dashboard > Settings > API Access.

Step 4: Customize the Widget

Open static/widget-config.js to configure layout, position, and dimensions:

JavascriptCopy code

Step 5: Deploy to a Hosting Platform

🚀 Option A: Deploy to Heroku

BashCopy code

🚀 Option B: Deploy to Render

1. Go to Render.com and sign up.
2. Create a new Web Service.
3. Connect your GitHub repo.
4. Set ASKHANDLE_API_TOKEN as an environment variable.
5. Use npm start as the start command.

Step 6: Embed the Widget on Your Website

Once deployed, copy your hosted widget-config.js URL and paste it just before the </body> tag on your site:

HtmlCopy code

Example: Full Embed Code

HtmlCopy code

🧼 Optional: Local Development Commands

🔗 When Should I Use the Default Widget Instead?

Use the WebSocket-based widget if you:

• Need live chat with human agents
• Want the fastest plug-and-play install via the AskHandle dashboard
• Don’t want to host the widget yourself

Default widget install code:

HtmlCopy code

• Open-source widget repo: GitHub – Forte-AI/light-chat-widget