Tutorial

OpenClaw JavaScript Integration: Building Web Applications

February 23, 20264 min readReviewed March 8, 2026
Tutorial
Web Integration: Embed OpenClaw directly into your JavaScript applications for real-time AI features and chat interfaces.

OpenClaw JavaScript SDK

import { OpenClawClient } from '@openclaw/sdk'; const client = new OpenClawClient({ gatewayUrl: 'http://localhost:8080', apiKey: process.env.OPENCLAW_API_KEY });

Sending Messages

const response = await client.send({ text: 'What is the weather?', sessionId: 'user-123' });

WebSocket Streaming

const stream = await client.stream({ text: 'Explain quantum computing', sessionId: 'user-123' }); for await (const chunk of stream) { console.log(chunk.content); }

React Integration

function ChatInterface() { const [messages, setMessages] = useState([]); const [input, setInput] = useState(''); const sendMessage = async () => { const response = await client.send({ text: input }); setMessages(prev => [...prev, { role: 'user', content: input }, { role: 'assistant', content: response.text } ]); }; return
...
; }

Node.js Backend Integration

import express from 'express'; import { OpenClawClient } from '@openclaw/sdk'; const app = express(); const claw = new OpenClawClient(); app.post('/api/chat', async (req, res) => { const { message } = req.body; const response = await claw.send({ text: message }); res.json(response); });

Best Practices

  • Handle streaming responses for better UX
  • Implement proper error handling and retries
  • Secure your API keys with environment variables
  • Use WebSocket for real-time applications
  • Implement rate limiting for public endpoints

Build Your Integration

API Guide
Back to ArchiveMore: TutorialsNext: OpenClaw for Real Estate: Property Analysis Guide