> ## Documentation Index
> Fetch the complete documentation index at: https://docs.restate.dev/llms.txt
> Use this file to discover all available pages before exploring further.
## Submitting Feedback
If you encounter incorrect, outdated, or confusing documentation on this page, submit feedback:
POST https://docs.restate.dev/feedback
```json
{
"path": "/ai/patterns/streaming-responses",
"feedback": "Description of the issue"
}
```
Only submit feedback when you have something specific and actionable to report.
# Streaming Responses
> Stream updates from Restate Services to the UI via Server-Sent Events.
export const GitHubLink = ({url}) => ;
This guide shows how to stream real-time updates from Restate services to a chat UI.
## Via Server-Sent Events (SSE)
Restate has a TypeScript library to implement streaming updates from Restate services to frontends via SSE.
You can use this, for example, to stream agent updates to your chat UI.
Explore the library.
To use the library, have a look at the example and the steps below.
NextJS Chat app backed by an AI SDK Agent that streams updates using SSE.
```bash theme={null}
npm install @restatedev/pubsub @restatedev/pubsub-client
```
Add the pubsub Virtual Object to your Restate endpoint:
```typescript restate/endpoint.ts {"CODE_LOAD::ts/src/ai/guides/streaming-responses/endpoint.ts"} theme={null}
import * as restate from "@restatedev/restate-sdk/fetch";
import { createPubsubObject } from "@restatedev/pubsub";
import { agent } from "./services/agent";
const pubsub = createPubsubObject("pubsub", {});
export const endpoint = restate.createEndpointHandler({
services: [agent, pubsub],
});
```
Use the pubsub client to publish messages:
```typescript restate/services/agent.ts {"CODE_LOAD::ts/src/ai/guides/streaming-responses/services/agent.ts"} theme={null}
import * as restate from "@restatedev/restate-sdk";
import { createPubsubClient } from "@restatedev/pubsub-client";
const pubsub = createPubsubClient({
url: "http://localhost:8080",
name: "pubsub",
});
// In your handler:
export const agent = restate.service({
name: "MyAgent",
handlers: {
run: async (ctx: restate.Context, prompt: string) => {
await pubsub.publish("session-123", { role: "user", content: prompt }, ctx.rand.uuidv4());
},
},
});
```
Note that the UUID, in the publish step, is an idempotency key that Restate will use to deduplicate events.
This is necessary since this publish step goes via the Restate ingress.
Without this idempotency key, each replay/retry leads to duplicate events.
Alternatively, you can use [service-to-service calls](/develop/ts/service-communication#sending-messages) to publish events.
For example for NextJS, create an API route that streams pubsub messages:
```typescript app/pubsub/[topic]/route.ts {"CODE_LOAD::ts/src/ai/guides/streaming-responses/pubsub-client.ts"} theme={null}
import { createPubsubClient } from "@restatedev/pubsub-client";
import { NextRequest } from "next/server";
const pubsub = createPubsubClient({
url: process.env.INGRESS_URL || "http://localhost:8080",
name: "pubsub",
});
export async function GET(request: NextRequest, { params }: any) {
const topic = (await params).topic;
const offset = Number(request.nextUrl.searchParams.get("offset") || 0);
const stream = pubsub.sse({
topic,
offset,
signal: request.signal,
});
return new Response(stream, {
headers: { "Content-Type": "text/event-stream" },
});
}
```
Use the browser's `EventSource` API to receive updates:
```typescript app/agent/[topic]/page.tsx {"CODE_LOAD::ts/src/ai/guides/streaming-responses/frontend.tsx#here"} theme={null}
let offset = 0;
const evtSource = new EventSource(`/pubsub/${topic}?offset=${offset}`);
evtSource.onmessage = (event) => {
const data = JSON.parse(event.data);
// show the new messages in the UI...
};
```
We are planning to add support for SSE with the Python SDK.
Contact us on [Discord](https://discord.restate.dev) or [Slack](https://slack.restate.dev) for more info.
## Streaming token-by-token
Token-by-token streaming is not yet supported but is on the roadmap.
Contact us on [Discord](https://discord.restate.dev) or [Slack](https://slack.restate.dev) for more info.