resumeAndPrerenderToNodeStream 使用 Node.js Stream. 将已预渲染的 React 树继续生成静态 HTML 字符串。
const {prelude, postponed} = await resumeAndPrerenderToNodeStream(reactNode, postponedState, options?)Reference
resumeAndPrerenderToNodeStream(reactNode, postponedState, options?)
调用 resumeAndPrerenderToNodeStream 以继续将已预渲染的 React 树生成静态 HTML 字符串。
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)。- optional
options:一个包含流式选项的对象。- optional
signal:一个 abort signal,允许你中止服务器渲染,并在客户端渲染其余部分。 - optional
onError:一个回调函数,只要发生服务器错误就会触发,无论该错误是可恢复的还是不可恢复的。默认情况下,这只会调用console.error。如果你覆盖它以记录崩溃报告,请确保你仍然调用console.error。
- optional
Returns
resumeAndPrerenderToNodeStream 返回一个 Promise:
- 如果渲染成功,Promise 将解析为一个包含以下内容的对象:
prelude:一个 HTML 的 Web Stream。你可以使用这个流分块发送响应,也可以将整个流读取为字符串。postponed:一个可 JSON 序列化的、不透明对象,如果resumeAndPrerenderToNodeStream被中止,它可以传递给resumeToNodeStream或resumeAndPrerenderToNodeStream。
- 如果渲染失败,Promise 将被拒绝。使用它来输出一个备用 shell。
Caveats
当进行预渲染时,nonce 不是可用的选项。nonce 必须对每个请求唯一,如果你使用 nonce 通过 CSP 保护你的应用,那么将 nonce 值包含在预渲染结果中是不合适且不安全的。
Usage
Further reading
resumeAndPrerenderToNodeStream 的行为与 prerender 类似,但可用于继续之前已开始且被中止的预渲染过程。
有关恢复已预渲染树的更多信息,请参阅 resume 文档。