unstable_routeRSCServerRequest

[MODES: data]

<docs-warning>This API is experimental and subject to breaking changes in minor/patch releases. Please use with caution and pay very close attention to release notes for relevant changes.</docs-warning>

Summary

Reference Documentation ↗

Routes the incoming Request to the RSC server and appropriately proxies the server response for data / resource requests, or renders to HTML for a document request.

tsx

import { createFromReadableStream } from "@vitejs/plugin-rsc/ssr";
import * as ReactDomServer from "react-dom/server.edge";
import {
  unstable_RSCStaticRouter as RSCStaticRouter,
  unstable_routeRSCServerRequest as routeRSCServerRequest,
} from "react-router";

routeRSCServerRequest({
  request,
  serverResponse,
  createFromReadableStream,
  async renderHTML(getPayload) {
    const payload = getPayload();

    return await renderHTMLToReadableStream(
      <RSCStaticRouter getPayload={getPayload} />,
      {
        bootstrapScriptContent,
        formState: await payload.formState,
      }
    );
  },
});

Signature

tsx

async function routeRSCServerRequest({
  request,
  serverResponse,
  createFromReadableStream,
  renderHTML,
  hydrate = true,
}: {
  request: Request;
  serverResponse: Response;
  createFromReadableStream: SSRCreateFromReadableStreamFunction;
  renderHTML: (
    getPayload: () => DecodedPayload,
    options: {
      onError(error: unknown): string | undefined;
      onHeaders(headers: Headers): void;
    },
  ) => ReadableStream<Uint8Array> | Promise<ReadableStream<Uint8Array>>;
  hydrate?: boolean;
}): Promise<Response>

Params

opts.createFromReadableStream

Your react-server-dom-xyz/client's createFromReadableStream function, used to decode payloads from the server.

opts.serverResponse

A Response or partial response generated by the RSC handler containing a serialized unstable_RSCPayload.

opts.hydrate

Whether to hydrate the server response with the RSC payload. Defaults to true.

opts.renderHTML

A function that renders the unstable_RSCPayload to HTML, usually using a <RSCStaticRouter>.

opts.request

The request to route.

Returns

A Response that either contains the RSC payload for data requests, or renders the HTML for document requests.