![\"SSE](\"/9be7e772d476f8f289103902ca00b5b4/sse-flow.svg\")
A language model takes a few seconds to write a paragraph. If your API waits for the full completion and returns it in one shot, the user stares at a spinner the whole time, and then the answer appears all at once. The model was producing words the entire time; you just hid them. Streaming gives that time back: the first token shows up in a few hundred milliseconds, and the rest fill in as the model writes.
\nThis post is for engineers who have a FastAPI backend in front of an LLM, plus a JavaScript frontend, and want the response to land word by word. It covers the server endpoint, the adapter that pulls text out of the model, the browser client, and the problems that appear after the demo works: proxy buffering, idle timeouts, errors mid-stream, and the limits of EventSource.
The transport is Server-Sent Events (SSE). I reached for it when I built the streaming chat panel in CloudCanvasAI, where you talk to Claude on the left and a document renders live on the right. The same shape works for any provider; Gemini Alchemy is another FastAPI backend of mine that streams the same way.
\nLLM streaming is one-directional. The client sends one prompt, and the server pushes a long sequence of tokens back. Nothing flows the other way until the next turn. That is exactly the shape Server-Sent Events was designed for: a one-way channel from server to browser over a single long-lived HTTP response.
\nWebSockets give you a full-duplex socket, where both sides can send at any time. That is more than this job needs, and it costs more to operate. A WebSocket leaves HTTP behind, so your auth middleware, logging, and load balancer rules all need a second path. SSE is plain HTTP with a particular content type, so everything that already understands a request keeps working. The browser side is a few lines, and reconnection is built into the EventSource interface instead of being something you write yourself.
The diagram below shows the whole system. A request goes out, and tokens come back on the same connection until the server signals that it is done.
\n
The bottom half of the diagram is the part people skip and then end up debugging. SSE is a concrete wire format. Each event is one or more lines of text, and a blank line ends it. Get the blank line wrong and the browser buffers your whole stream, waiting for an event that never closes.
\nFastAPI can stream whatever an async generator yields. (An async generator is an async def function that uses yield to produce values one at a time.) Wrap the generator in a StreamingResponse with the text/event-stream media type, and you have a working SSE endpoint. The handler below uses a small sse helper to format each message, sends model output as token events, and ends with a done event.
import json\nfrom fastapi import FastAPI\nfrom fastapi.responses import StreamingResponse\n\napp = FastAPI()\n\ndef sse(event: str, data: dict) -> str:\n \"\"\"Format one SSE message. The trailing blank line ends the event.\"\"\"\n return f\"event: {event}\\ndata: {json.dumps(data)}\\n\\n\"\n\nasync def token_stream(prompt: str):\n async for delta in call_model(prompt): # your provider's streaming call\n yield sse(\"token\", {\"text\": delta})\n yield sse(\"done\", {})\n\n@app.get(\"/chat\")\nasync def chat(prompt: str):\n return StreamingResponse(\n token_stream(prompt),\n media_type=\"text/event-stream\",\n headers={\n \"Cache-Control\": \"no-cache\",\n \"X-Accel-Buffering\": \"no\", # tell nginx not to buffer\n },\n )Two details in that handler do real work:
\n\\n\\n at the end of every message is the event boundary. Without it, the client never sees a complete event.X-Accel-Buffering: no header is meant for the reverse proxy. Leaving it out causes the single most common “streaming doesn’t stream” bug, which the proxy section below explains.If you would rather not format the wire bytes by hand, sse-starlette provides an EventSourceResponse that takes the same async generator. It handles the framing and sends periodic pings. On a small service, the manual version above is fine and keeps the dependency list short.
Every major SDK exposes its streaming output as an async iterator of deltas, meaning the small chunks of new text the model produced since the previous chunk. With Anthropic’s SDK, the streaming API looks like this:
\nfrom anthropic import AsyncAnthropic\n\nclient = AsyncAnthropic()\n\nasync def call_model(prompt: str):\n async with client.messages.stream(\n model=\"claude-sonnet-4-6\",\n max_tokens=1024,\n messages=[{\"role\": \"user\", \"content\": prompt}],\n ) as stream:\n async for text in stream.text_stream:\n yield textcall_model opens the stream and passes each piece of text from text_stream straight through. Other providers follow the same pattern; only the method names change.
Keep this adapter separate from the SSE formatting. The endpoint should not care which model is behind it, and you will want to swap models without touching the transport. That separation is what let CloudCanvasAI route different document tasks through different skills while the streaming endpoint stayed the same.
\nIn the browser, the consumer is small. Open an EventSource, listen for your named events (token and done), and append each token as it arrives.
const source = new EventSource(`/chat?prompt=${encodeURIComponent(prompt)}`);\n\nsource.addEventListener(\"token\", (e) => {\n const { text } = JSON.parse(e.data);\n appendToMessage(text); // your state update\n});\n\nsource.addEventListener(\"done\", () => {\n source.close(); // stop, or the browser will reconnect\n});\n\nsource.onerror = () => {\n source.close(); // handle the failure, then decide to retry\n};Always call close() on done. If you do not, EventSource treats the closed connection as a dropped one and reconnects automatically, which sends your whole request again. Auto-reconnect is useful for genuine network blips. It is annoying when it re-runs a paid completion because you forgot to close a finished stream.
You write all of the above, it streams perfectly against localhost, you deploy it behind nginx, and the tokens arrive in one lump at the end. Nothing in your code changed. The reverse proxy (the server in front of your app that forwards requests to it) is buffering the response. It collects the whole body before passing it on, which defeats the point.
The fix has two sides:
\nX-Accel-Buffering: no response header from the handler tells nginx to pass this one response straight through.proxy_buffering off;.Both settings exist because buffering is the right default for normal responses and the wrong one for a stream, so you have to opt out explicitly. The behavior is documented in the nginx proxy module. Check it first whenever streaming works locally but not in production.
\nA stream that goes quiet is ambiguous. The model might be thinking, or the connection might be dead, and the client cannot tell which. Proxies and load balancers also close idle connections after a timeout. A heartbeat handles both problems. Every fifteen seconds or so, send an SSE comment line: a line that begins with a colon, which the client ignores. The generator below sends one as soon as the stream opens, before the first token:
\nasync def token_stream(prompt: str):\n yield \": keep-alive\\n\\n\" # comment line, ignored by EventSource\n async for delta in call_model(prompt):\n yield sse(\"token\", {\"text\": delta})\n yield sse(\"done\", {})Once tokens are flowing, the data itself keeps the connection warm, so the heartbeat mostly matters in the gap before the first token, while the model is still reading a long prompt. If you use sse-starlette, its ping mechanism does this for you.
Once you have sent a 200 OK and started streaming, you cannot take it back. If the model call throws on token five hundred, the HTTP status went out long ago. The honest option is to send the error as its own event and let the client react. The generator below catches the failure, emits an error event, and always finishes with done:
async def token_stream(prompt: str):\n try:\n async for delta in call_model(prompt):\n yield sse(\"token\", {\"text\": delta})\n except Exception as exc:\n yield sse(\"error\", {\"message\": \"generation failed\"})\n log.exception(\"stream failed: %s\", exc)\n finally:\n yield sse(\"done\", {})The client listens for error the same way it listens for token. It then marks the partial message as failed, instead of leaving a half-written reply hanging. Log the real exception on the server, and send the user a generic message so a stack trace never goes out on the wire.
The real limitation of EventSource is that it issues a GET and cannot set a request body or custom headers. For a short prompt, a query string is fine. For a long chat history, GET stops being workable. A bearer token does not belong in the URL either, because a token in a query string ends up in access logs.
There are two ways out:
\nEventSource with fetch. Read the same text/event-stream response with fetch and a ReadableStream. This lets you POST a JSON body and set headers, while you parse the exact same event format yourself.I used the second option in CloudCanvasAI, because each turn carries context and auth that have no business sitting in a URL. You give up the built-in reconnect and parse the stream by hand. For an authenticated chat endpoint, that is the right trade.
\nSSE is the smaller, calmer choice for this job, and the price is its narrowness. By design, it carries text in one direction. Streaming raw binary means base64 encoding, which bloats the payload. Anything genuinely bidirectional and low-latency, like a voice loop, is a WebSocket job. SSE earns its place when the interaction is request in, long text out, which covers most LLM chat and most agent output.
\nThe operational cost is that you now hold a connection open for the length of a generation. Long-lived requests change how you think about worker counts, timeouts, and graceful shutdown. Run an async server such as uvicorn so a streaming request does not pin a whole worker. And make sure your deploy drains in-flight streams instead of cutting them off mid-token.
Early on, I let token formatting and model calls bleed into the same function, so swapping a model meant editing the streaming path. Splitting the provider adapter from the SSE layer, as the code above does, is worth doing from the first commit.
\nI would also send a stable message id in the first event from the start. When a stream drops and the user retries, that id lets you reconcile the partial message instead of leaving a duplicate. It is far cheaper to add on day one than to backfill once the UI already assumes there is no id.
\nIf you want to see this pattern inside a full product, CloudCanvasAI pairs a streaming FastAPI backend with a live document preview. Gemini Alchemy streams structured output from a FastAPI service into an interactive UI. In both, the transport is the handful of lines above.
\nImage credit: SSE streaming diagrams by M. Hassan Ahmed, created for this post, released under CC0 (public domain).
","frontmatter":{"title":"Streaming LLM Responses from FastAPI with SSE","date":"2026-06-30T00:00:00.000Z","description":"Stream LLM output token by token from a FastAPI backend with Server-Sent Events: working code, the EventSource client, proxy buffering, and failure modes.","thumbnail":{"childImageSharp":{"fluid":{"base64":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAALCAIAAADwazoUAAAACXBIWXMAAAsSAAALEgHS3X78AAABk0lEQVQoz32P63KbMBCF+QnCuiJsg7gYHG4yJNgZ1zXGafwASZr2/d+lKxon7p/OfHNmdfastLJ4NUh91s+/q/NbcXqtn36W49vd8AJHKKrRmPr5V3l6bX68T4F3rxl5dRL1yUIknFFV1PuuPzftcfMwNt1Q6QMUuhvqzfdqc2h7Y97vnur2uK4eIQ9TLlGWK1IkEptGiCeAw+K/BWLJZwGmQ2OTYYlNlMsTg0gtRJWDA3MTi1wWT0RX4g/lMfcz4mfYA12DYrEC3yKhlvmjSHvXy+AiBI/A4zdAyCFREGuZaC9qRdhgvyB+YYZltq8PL2l3kastz3ue7+Z6YPlWNkdRfuPlXj5cvKRbZn2zvRTdyIIazwss17CUxVQrVMfje7wozE+8FQ1KurijyxL7uSuBDNaWSof5DpSolqoWNnepshwSOCScCODzDl4iEiAaouvRQAKXpwaRzrwVAAWY1kfbEHzW9pf5P2B4cWXuspDKFIuYeAn1UtAZj0CJSEChC5mb/MKyZ/MvJsu+ad86/yQn/gCzpkI6b86R9QAAAABJRU5ErkJggg==","aspectRatio":1.899441340782123,"src":"/static/aa9d918b5ab39f1c4481960a11c4f9a9/40a76/hero.png","srcSet":"/static/aa9d918b5ab39f1c4481960a11c4f9a9/c972b/hero.png 340w,\n/static/aa9d918b5ab39f1c4481960a11c4f9a9/27625/hero.png 680w,\n/static/aa9d918b5ab39f1c4481960a11c4f9a9/40a76/hero.png 1360w,\n/static/aa9d918b5ab39f1c4481960a11c4f9a9/ed396/hero.png 2000w","sizes":"(max-width: 1360px) 100vw, 1360px"}}}}}},"pageContext":{"slug":"/2026-06-30-fastapi-sse-streaming-llm/","previous":"blog/2026-06-30-llm-agent-tool-loop/","next":"blog/2026-06-29-incremental-rag-indexing/"}},"staticQueryHashes":["32046230"]}