
resumeAndPrerenderToNodeStream()
resumeAndPrerenderToNodeStream()
resumeAndPrerenderToNodeStream 使用 Node.js Stream 将预渲染的 React 树继续渲染为静态 HTML 字符串。
js
const {prelude, postponed} = await resumeAndPrerenderToNodeStream(reactNode, postponedState, options?)
注意:
此 API 是 Node.js 特有的。使用 Web Streams 的环境(如 Deno 和现代边缘运行时)应改用
resumeAndPrerender。
参考 {/reference/}
resumeAndPrerenderToNodeStream(reactNode, postponedState, options?) {/resumeandprerendertolnodestream/}
调用 resumeAndPrerenderToNodeStream 将预渲染的 React 树继续渲染为静态 HTML 字符串。
js
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 变为可交互。
参数 {/parameters/}
reactNode:你在调用prerender(或上一次resumeAndPrerenderToNodeStream)时传入的 React 节点。例如<App />这样的 JSX 元素。它应当代表整个文档,因此App组件应渲染<html>标签。postponedState:从 prerender API 返回的不透明postpone对象,从你存储它的任何地方(例如 redis、文件或 S3)加载。- 可选
options:包含流式选项的对象。- 可选
signal:一个 abort signal,用于中止服务器渲染并在客户端渲染其余部分。 - 可选
onError:每当发生服务器错误时触发的回调,无论该错误是可恢复的还是不可恢复的。默认情况下,它只会调用console.error。如果你覆盖它以记录崩溃报告,请确保仍然调用console.error。
- 可选
返回值 {/returns/}
resumeAndPrerenderToNodeStream 返回一个 Promise:
- 如果渲染成功,该 Promise 将解析为一个包含以下内容的对象:
prelude:HTML 的 Node.js Stream。你可以使用该流分块发送响应,也可以将整个流读取为字符串。postponed:一个可 JSON 序列化的不透明对象。如果resumeAndPrerenderToNodeStream被中止,可以将其传给resumeToNodeStream或resumeAndPrerenderToNodeStream。
- 如果渲染失败,该 Promise 将被拒绝(reject)。据此输出一个回退壳(fallback shell)。
注意事项 {/caveats/}
在预渲染时,nonce 不是可用的选项。Nonce 必须针对每个请求唯一。如果你使用 nonce 配合 CSP 保护应用安全,将 nonce 值包含在预渲染本身中是不恰当且不安全的。
我什么时候应该使用 resumeAndPrerenderToNodeStream? {/when-to-use-prerender/}
静态的 resumeAndPrerenderToNodeStream API 用于静态服务器端生成(SSG)。与 renderToString 不同,resumeAndPrerenderToNodeStream 会等待所有数据加载完成后再解析。这使得它适合为完整页面生成静态 HTML,包括需要使用 Suspense 获取的数据。要在数据加载时以流式传输内容,请使用 renderToReadableStream 这类流式服务器端渲染(SSR)API。
resumeAndPrerenderToNodeStream 可以被中止,之后可以用另一个 resumeAndPrerenderToNodeStream 继续,或用 resume 恢复,以支持部分预渲染。
用法 {/usage/}
延伸阅读 {/further-reading/}
resumeAndPrerenderToNodeStream 的行为与 prerender 类似,但可用于继续之前已中止的预渲染过程。
关于恢复预渲染树的更多信息,请参阅 resume 文档。
帮助我们改进文档
发现翻译问题或内容错误?请告诉我们。
