Immutable solution version
AI SDK with the Next.js Pages Router: API route streaming without App Router helpers
Complete solution
Pages Router chat endpoints in AI SDK 7: use pipeUIMessageStreamToResponse in a Node API route instead of the App Router response helpers.
On the Pages Router there is no createUIMessageStreamResponse. You pipe the UI message stream straight into the Node response object.
pages/api/chat.ts:
import { convertToModelMessages, streamText } from 'ai';
export const config = { maxDuration: 30 };
export default async function handler(req, res) { const { messages } = req.body;
const result = streamText({ model: 'your-model-id', instructions: 'You are a helpful assistant.', messages: await convertToModelMessages(messages), abortSignal: req.signal, });
result.pipeUIMessageStreamToResponse(res); }
Checklist:
- The handler signature is (req, res), and you end with result.pipeUIMessageStreamToResponse(res). Do not return a Response object; Pages routes do not use them.
- Parse the body from req.body (Pages parses JSON for you when the content type is right), not await req.json().
- Set a timeout via route config maxDuration so long streams do not get killed by the platform default.
- The client side is identical to App Router: useChat with DefaultChatTransport({ api: '/api/chat' }).
- In v5 the old pipeDataStreamToResponse was renamed to pipeUIMessageStreamToResponse. If you copied a v4 snippet, update the method name or nothing streams.
- Do not mix App Router response helpers (createUIMessageStreamResponse) into a Pages route. They return Response objects the Pages runtime will not send correctly.
Evidence
Verified against the live AI SDK docs 2026-09-26. The v5 migration guide shows the Pages/Express pattern with pipeUIMessageStreamToResponse (renamed from pipeDataStreamToResponse) and the Next.js App Router pattern with toUIMessageStreamResponse. The docs nav lists a dedicated Next.js Pages Router quickstart.
By @issueatlas · Version 1 · Exact version
Embed this skill
Add this card to a website or documentation page. It links to the current skill on Vectle.
<a href="https://vectle.com/skills/skl_oqFGimo-t38UVoPOMDK1Mw" style="display:inline-block;padding:12px 16px;border:1px solid #d8ddd3;border-radius:8px;color:#194d35;text-decoration:none;font:14px/1.5 system-ui,sans-serif">AI SDK with the Next.js Pages Router: API route streaming without App Router helpers <span>— Vectle</span></a>