resumeToPipeableStream

resumeToPipeableStream 将预渲染的 React 树流式传输到可管道的 Node.js 流。

const {pipe, abort} = await resumeToPipeableStream(reactNode, postponedState, options?)

参考
- resumeToPipeableStream(node, postponed, options?)
用法
- 延伸阅读

注意

此 API 特定于 Node.js。具有 Web Streams 的环境，如 Deno 和现代边缘运行时，应该改用 resume。

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

参考

🌐 Reference

`resumeToPipeableStream(node, postponed, options?)`

调用 resume 将预渲染的 React 树作为 HTML 渲染到 Node.js 流中

🌐 Call resume to resume rendering a pre-rendered React tree as HTML into a Node.js Stream.

import { resume } from 'react-dom/server';
import {getPostponedState} from './storage';

async function handler(request, response) {
  const postponed = await getPostponedState(request);
  const {pipe} = resumeToPipeableStream(<App />, postponed, {
    onShellReady: () => {
      pipe(response);
    }
  });
}

查看更多示例。

参数

🌐 Parameters

reactNode：你调用的 React 节点 prerender。例如，一个像 <App /> 这样的 JSX 元素。它预计表示整个文档，因此 App 组件应渲染 <html> 标签。
postponedState：从 prerender API 返回的不可见 postpone 对象，从你存储它的地方加载（例如 redis、文件或 S3）。
可选 options：一个带有流选项的对象。
- 可选 nonce：一个nonce字符串，用于允许script-src 内容安全策略`的脚本。
- 可选 signal：一个中止信号，允许你中止服务器渲染并在客户端渲染剩余的内容。
- 可选 onError：每当发生服务器错误时触发的回调，无论是可恢复的还是不可恢复的。默认情况下，这只会调用 console.error。如果你重写它以记录崩溃报告，请确保你仍然调用 console.error。
- 可选 onShellReady：在shell 完成后立即触发的回调。你可以在这里调用 pipe 来开始流式传输。React 会在 shell 之后流式传输额外内容，同时使用内联 <script> 标签将 HTML 加载回退替换为内容。
- 可选 onShellError：如果渲染 shell 时发生错误，会触发的回调。它接收错误作为参数。流中还没有输出任何字节，且 onShellReady 和 onAllReady 都不会被调用，因此你可以输出一个备用的 HTML shell或使用前奏。

🌐 Returns

resume 返回一个包含两个方法的对象：

pipe 将 HTML 输出到提供的 Writable Node.js 流。如果你想启用流式传输，请在 onShellReady 中调用 pipe，或者在 onAllReady 中为爬虫和静态生成调用它。
abort 允许你中止服务器渲染并在客户端渲染其余部分。

注意事项

🌐 Caveats

resumeToPipeableStream 不接受 bootstrapScripts、bootstrapScriptContent 或 bootstrapModules 的选项。相反，你需要将这些选项传递给生成 postponedState 的 prerender 调用。你也可以手动将引导内容注入可写流。
resumeToPipeableStream不接受identifierPrefix，因为前缀在prerender和resumeToPipeableStream中需要相同。
由于无法向预渲染提供 nonce，只有在不向预渲染提供脚本的情况下，你才应该将 nonce 提供给 resumeToPipeableStream。
resumeToPipeableStream 会从根重新渲染，直到找到一个未完全预渲染的组件。只有完全预渲染的组件（组件及其子组件完成预渲染）会被完全跳过。

用法

🌐 Usage

延伸阅读

🌐 Further reading

Resuming 的行为类似于 renderToReadableStream。要查看更多示例，请查看 renderToReadableStream 的使用部分。 prerender 的使用部分包含了如何具体使用 prerenderToNodeStream 的示例。

🌐 Resuming behaves like renderToReadableStream. For more examples, check out the usage section of renderToReadableStream. The usage section of prerender includes examples of how to use prerenderToNodeStream specifically.

上一章resume

下一章静态 API