Build a CMS Writing Assistant With Live Token Streams

A streaming writing assistant lets CMS users watch a draft appear while they continue working. Instead of waiting for a complete response, an editor can review the opening, stop an unhelpful direction, or accept a useful paragraph. This walkthrough builds that workflow around a server endpoint, a live preview, and an explicit action that inserts generated text into the document.

§1 Step 1: Add a writing panel beside the CMS editor

Start with three actions: draft a paragraph, rewrite selected text, and suggest a headline. Each action should collect the instruction, relevant content, and a small amount of editorial context. Include the publication’s tone and target audience when available.

Give the panel a prompt field, a Generate button, a Stop button, and a preview area. Keep generated content in the preview until the editor chooses to insert or replace text. This makes experimentation reversible and preserves the saved article.

§2 Step 2: Route generation through your application server

Create an authenticated endpoint such as /api/writing/stream. The browser sends the requested action, selected passage, and document identifier. Your server checks editing permissions, validates input length, and constructs the model request.

Fluxio fits here as a streaming-first, pay-per-token AI API relay that provides access to multiple model providers through one key. With an OpenAI-style client, configure the base URL as https://api.fluxioapi.com/v1 and keep the API key in a server environment variable. Enable streaming in the request and select a model using its documented API identifier.

For example, evaluate Claude Haiku 4.5 on your publication’s rewriting tasks before choosing a default. Check output quality, response speed, and token cost against representative articles.

§3 Step 3: Send focused instructions and bounded context

Build the request from a fixed editorial instruction and clearly separated document material. Ask for the requested passage only, specify the desired length, and describe any formatting requirements. Treat article text as source material that may contain untrusted instructions.

• – Send the selected passage and nearby paragraphs for a rewrite.
• – Send the article summary and audience for headline suggestions.
• – Set an output limit appropriate to the requested task.

Avoid sending the entire CMS record by default. Narrow context reduces unnecessary token usage and helps the assistant stay focused on the editor’s request.

§4 Step 4: Forward text deltas through an SSE response

Have the server consume the upstream stream and forward text deltas to the browser using server-sent events. A browser fetch request can post the task and read the response body incrementally. Set the response content type to text/event-stream and ensure your hosting stack allows streamed responses without buffering.

Define application events for text deltas, completion, and errors. Network chunks can split an event or contain several events, so buffer incoming bytes and parse complete SSE frames. Decode UTF-8 incrementally to preserve characters split across chunks. Although the experience feels token by token, a delivered delta can contain several tokens.

§5 Step 5: Render the preview and support cancellation

Append incoming text to a preview buffer and refresh the display in small batches to keep typing and scrolling responsive. Render the preview as text. If you later support generated rich text, sanitize it before inserting it into the editor.

Wire Stop to an AbortController in the browser, and propagate disconnection or cancellation to the upstream request on the server. Mark interrupted output as incomplete. Preserve that text for review, but require a deliberate action before insertion.

§6 Step 6: Test streaming inside the publishing workflow

Test slow connections, interrupted streams, expired sessions, and upstream failures. Verify that partial output survives an error and that retrying does not silently duplicate content. If the editor changes the selected passage during generation, require a fresh selection before replacing it.

Measure time to first visible text, completion time, cancellation behavior, and reported token usage. Add per-user request limits and output caps to control spending. Keep publication behind the CMS’s existing review process, with the editor deciding which generated words belong in the article.

Sign up for Fluxio to build your streaming CMS assistant.