Home Tutorials Categories Skills About
ZH EN JA KO
Channels

OpenClaw WebChat Configuration

· 15 min read

Introduction

Among the many chat channels supported by OpenClaw, WebChat is a unique offering. It does not depend on any third-party platform; instead, it is built directly into OpenClaw's Web Dashboard and uses the WebSocket protocol for real-time communication between the browser and the AI assistant. Whether you want to provide an AI conversation entry point on your own website or simply test AI models quickly in your browser, WebChat is the most straightforward choice.

WebChat Technical Architecture

WebChat is built on the WebSocket protocol and is part of the OpenClaw Gateway interface. Unlike the traditional HTTP request-response model, WebSocket establishes a persistent, bidirectional communication connection where messages can be transmitted instantly between the server and client without repeatedly establishing connections.

Browser Client                     OpenClaw Gateway
    |                              |
    |---- WebSocket Handshake ---->|
    |<--- 101 Switching Protocol --|
    |                              |
    |---- User Message ----------->|
    |                              |--> AI Model Processing
    |<--- AI Streaming Reply ------|<--
    |<--- AI Streaming Reply ------|
    |<--- Reply Complete Signal ---|
    |                              |

This architecture provides two significant advantages: first, message latency is extremely low — users start receiving AI replies almost immediately after sending; second, it supports streaming output, where the AI's response can be displayed word by word on the page rather than waiting for the entire reply to be generated before showing it all at once.

Enabling WebChat

WebChat is a native integration in OpenClaw and is enabled by default alongside the Dashboard. As long as your OpenClaw Gateway service is running, WebChat is already available.

Confirm that the Gateway service is running:

openclaw up -d

Then visit the Dashboard in your browser:

http://localhost:18789/dashboard

You can find the WebChat entry in the Dashboard sidebar. Click to enter the web chat interface.

If you want to explicitly manage WebChat's enabled status in the configuration file, edit ~/.config/openclaw/openclaw.json5:

{
  channels: {
    webchat: {
      enabled: true,
      // WebSocket connection path (default is fine)
      wsPath: "/ws/chat",
      // Allowed origin domains (CORS control)
      allowedOrigins: ["*"],
      // Maximum idle time per connection (seconds)
      idleTimeout: 300,
      // Maximum concurrent WebSocket connections
      maxConnections: 50
    }
  }
}

WebChat-Specific Configuration

Like other channels, WebChat supports independent model, persona, and skill configurations. You can assign WebChat a completely different set of AI behaviors from Telegram or Discord:

{
  channels: {
    webchat: {
      enabled: true,
      model: {
        provider: "claude",
        name: "claude-sonnet-4-20250514",
        apiKey: "sk-ant-xxxxx"
      },
      persona: {
        name: "Web Assistant",
        systemPrompt: "You are a professional online customer service assistant that answers user questions about products and services. Your tone should be friendly yet professional."
      },
      skills: ["faq", "product-docs", "weather"],
      temperature: 0.7,
      maxTokens: 2048
    }
  }
}

Running Alongside Other Channels

One of WebChat's greatest conveniences is that it can run simultaneously with all other channels without interference. You can enable Telegram, WhatsApp, Discord, and WebChat on the same OpenClaw instance, with each channel independently handling its own message stream and conversation context.

{
  channels: {
    telegram: { enabled: true, botToken: "your-token" },
    whatsapp: { enabled: true, phoneNumber: "+8613800138000" },
    webchat:  { enabled: true }
  }
}

An issue in one channel (e.g., Telegram going offline) will not affect WebChat's normal operation, and vice versa. OpenClaw's channel isolation architecture ensures the independence of each channel.

Security Configuration

Since WebChat is directly exposed in the browser, security configuration is especially important. The following measures are recommended:

Restrict Access Origins: Use allowedOrigins to set allowed domains and prevent unauthorized websites from calling your WebChat interface.

{
  channels: {
    webchat: {
      enabled: true,
      allowedOrigins: ["https://yourdomain.com", "https://app.yourdomain.com"]
    }
  }
}

Set a Dashboard Password: Configure a password for the Dashboard to ensure only authorized users can use WebChat.

openclaw config set dashboard.password "your-secure-password"
openclaw restart

Deploy HTTPS: If WebChat is exposed on the public internet, be sure to configure HTTPS through an Nginx reverse proxy. The WebSocket connection will automatically upgrade to the encrypted WSS protocol.

Use Cases

WebChat is particularly well-suited for the following scenarios:

  • Quick Testing: After configuring a new model or adjusting a persona, test the results directly in the browser without switching to another chat application.
  • Website Customer Service: Embed an AI conversation entry point on your product website to provide visitors with instant Q&A.
  • Internal Tools: Team members interact with the AI assistant directly through the browser without installing additional chat clients.
  • Demos and Presentations: WebChat is the most intuitive way to demonstrate OpenClaw's capabilities to others.

FAQ

What is the difference between WebChat and "New Conversation" in the Dashboard?

The Dashboard conversation feature is primarily for managing and viewing historical conversations from various channels. WebChat is an independent chat channel with its own configuration options (model, persona, skills, etc.), and conversation records are saved as WebChat channel records.

What if the WebSocket connection drops?

WebChat has a built-in auto-reconnect mechanism. When network fluctuations cause a WebSocket disconnection, the client automatically attempts to re-establish the connection. If it persistently fails to connect, check whether the Gateway service is running properly:

openclaw doctor

Is it supported on mobile browsers?

Yes. The WebChat interface is responsively designed and works properly in mobile and tablet browsers.

Summary

As OpenClaw's built-in web chat channel, WebChat provides a zero-dependency, low-barrier AI conversation experience. Its WebSocket-based real-time communication architecture ensures smooth interactions, and its native integration design allows it to run seamlessly alongside other channels. Whether for daily testing, website integration, or internal team use, WebChat is a channel worth enabling.

OpenClaw is a free, open-source personal AI assistant that supports WhatsApp, Telegram, Discord, and many more platforms