API 参考
静态 API

resumeAndPrerenderToNodeStream

resumeAndPrerenderToNodeStream 使用 Node.js 流。 将预渲染的 React 树继续为静态 HTML 字符串。

¥resumeAndPrerenderToNodeStream continues a prerendered React tree to a static HTML string using a a Node.js Stream..

const {prelude, postponed} = await resumeAndPrerenderToNodeStream(reactNode, postponedState, options?)

注意

此 API 特定于 Node.js。具有 网络流， 的环境（如 Deno 和现代 Edge 运行时）应改用 prerender。

¥This API is specific to Node.js. Environments with Web Streams, like Deno and modern edge runtimes, should use prerender instead.

参考

¥Reference

resumeAndPrerenderToNodeStream(reactNode, postponedState, options?)

调用 resumeAndPrerenderToNodeStream 将预渲染的 React 树延续到静态 HTML 字符串。

¥Call resumeAndPrerenderToNodeStream to continue a prerendered React tree to a static HTML string.

import { resumeAndPrerenderToNodeStream } from 'react-dom/static';
import { getPostponedState } from 'storage';

async function handler(request, writable) {
  const postponedState = getPostponedState(request);
  const { prelude } = await resumeAndPrerenderToNodeStream(<App />, JSON.parse(postponedState));
  prelude.pipe(writable);
}

在客户端，调用 hydrateRoot 使服务器生成的 HTML 具有交互性。

¥On the client, call hydrateRoot to make the server-generated HTML interactive.

请参阅下面的更多示例。

¥See more examples below.

参数

¥Parameters

  • reactNode：调用 prerender（或之前的 resumeAndPrerenderToNodeStream）的 React 节点。例如，像 <App /> 这样的 JSX 元素。它应该代表整个文档，所以 App 组件应该渲染 <html> 标签。

    ¥reactNode: The React node you called prerender (or a previous resumeAndPrerenderToNodeStream) with. For example, a JSX element like <App />. It is expected to represent the entire document, so the App component should render the <html> tag.

  • postponedState：从 预渲染 API 返回的不透明 postpone 对象，从存储它的任何位置加载（例如，Redis、文件或 S3）。

    ¥postponedState: The opaque postpone object returned from a prerender API, loaded from wherever you stored it (e.g. redis, a file, or S3).

  • 可选 options：具有流选项的对象。

    ¥optional options: An object with streaming options.

    • 可选 signal：一个 中止信号，它允许你 中止服务器渲染 并在客户端上渲染其余部分。

      ¥optional signal: An abort signal that lets you abort server rendering and render the rest on the client.

    • 可选 onError：每当出现服务器错误时都会触发的回调，无论是 recoverable 还是 不。 默认情况下，这只会调用 console.error。如果你将其改写为 记录崩溃报告，，请确保你仍然调用 console.error。

      ¥optional onError: A callback that fires whenever there is a server error, whether recoverable or not. By default, this only calls console.error. If you override it to log crash reports, make sure that you still call console.error.

返回

¥Returns

resumeAndPrerenderToNodeStream 返回一个 Promise：

¥resumeAndPrerenderToNodeStream returns a Promise:

  • 如果渲染成功，则 Promise 将解析为包含以下内容的对象：

    ¥If rendering the is successful, the Promise will resolve to an object containing:

    • prelude：Web 流 的 HTML。你可以使用此流分块发送响应，也可以将整个流读入字符串。

      ¥prelude: a Web Stream of HTML. You can use this stream to send a response in chunks, or you can read the entire stream into a string.

    • postponed：一个 JSON 可序列化的不透明对象，如果 resumeAndPrerenderToNodeStream 中止，则可以传递给 resumeToNodeStream 或 resumeAndPrerenderToNodeStream。

      ¥postponed: an JSON-serializeable, opaque object that can be passed to resumeToNodeStream or resumeAndPrerenderToNodeStream if resumeAndPrerenderToNodeStream is aborted.

  • 如果渲染失败，则 Promise 将被拒绝。使用它来输出回退 shell。

    ¥If rendering fails, the Promise will be rejected. Use this to output a fallback shell.

注意事项

¥Caveats

nonce 在预渲染时不可用。每个请求的 nonce 必须是唯一的，如果你使用 nonce 来通过 CSP 保护你的应用，则将 nonce 值包含在预渲染本身中是不合适且不安全的。

¥nonce is not an available option when prerendering. Nonces must be unique per request and if you use nonces to secure your application with CSP it would be inappropriate and insecure to include the nonce value in the prerender itself.

注意

我什么时候应该使用 resumeAndPrerenderToNodeStream？

¥When should I use resumeAndPrerenderToNodeStream?

静态 resumeAndPrerenderToNodeStream API 用于静态服务器端生成 (SSG)。与 renderToString 不同，resumeAndPrerenderToNodeStream 等待所有数据加载后再解析。这使其适合为整个页面生成静态 HTML，包括需要使用 Suspense 获取的数据。要在加载时流式传输内容，请使用流式服务器端渲染 (SSR) API，如 renderToReadableStream。

¥The static resumeAndPrerenderToNodeStream API is used for static server-side generation (SSG). Unlike renderToString, resumeAndPrerenderToNodeStream waits for all data to load before resolving. This makes it suitable for generating static HTML for a full page, including data that needs to be fetched using Suspense. To stream content as it loads, use a streaming server-side render (SSR) API like renderToReadableStream.

resumeAndPrerenderToNodeStream 可以中止，稍后可以使用另一个 resumeAndPrerenderToNodeStream 继续，或使用 resume 恢复以支持部分预渲染。

¥resumeAndPrerenderToNodeStream can be aborted and later either continued with another resumeAndPrerenderToNodeStream or resumed with resume to support partial pre-rendering.

用法

¥Usage

延伸阅读

¥Further reading

resumeAndPrerenderToNodeStream 的行为与 prerender 类似，但可用于继续先前启动但已中止的预渲染进程。有关恢复预渲染树的更多信息，请参阅 恢复文档。

¥resumeAndPrerenderToNodeStream behaves similarly to prerender but can be used to continue a previously started prerendering process that was aborted. For more information about resuming a prerendered tree, see the resume documentation.

上一章resumeAndPrerender