A real-time AI streaming chat that automatically resumes when you disconnect and reconnect. Built with Cloudflare Agents and Durable Objects.
This example demonstrates client reconnect recovery. It does not enable chatRecovery, so it is not testing recovery from Durable Object eviction while the model call is in flight. For that path, see experimental/forever-chat.
- Resumable streaming: Start a long AI response, refresh the page, and watch it pick up exactly where it left off
- Automatic reconnection: The WebSocket reconnects automatically, no user action needed
- Message persistence: Chat history survives disconnects and page reloads via
useAgentChat - Buffered chunk replay: All chunks generated while disconnected are replayed on reconnect
-
Copy the environment template and add your OpenAI API key:
cp .env.example .env
-
Install dependencies from the repo root:
npm install
-
Start the dev server:
npm start
The server (src/server.ts) uses AIChatAgent with streamText — nothing special is needed. Resumability is built into the agent protocol.
The client (src/client.tsx) uses useAgentChat which automatically handles:
- Detecting an active stream on reconnect
- Sending an ACK to the server
- Receiving all buffered chunks and continuing the stream
| Variable | Description |
|---|---|
OPENAI_API_KEY |
Your OpenAI API key |
- Runtime: Cloudflare Workers + Durable Objects
- UI: React, Tailwind CSS, Kumo (workers theme)
- AI: Vercel AI SDK with OpenAI
- Build: Vite +
@cloudflare/vite-plugin