resumeToPipeableStream

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

¥resumeToPipeableStream streams a pre-rendered React tree to a pipeable Node.js Stream.

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

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

注意

此 API 特定于 Node.js。具有网络流，的环境（如 Deno 和现代 Edge 运行时）应改用 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);
    }
  });
}

请参阅下面的更多示例。

¥See more examples below.

参数

¥Parameters

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

¥reactNode: The React node you called prerender 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.
- 可选 nonce：允许 script-src Content-Security-Policy 脚本的 nonce 字符串。
  
  ¥optional nonce: A nonce string to allow scripts for script-src Content-Security-Policy.
- 可选 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.
- 可选 onShellReady：shell 完成后立即触发回调。你可以在此处调用 pipe 来开始流式传输。React 将在 shell 之后调用流式传输附加内容，同时使用内联 <script> 标签将 HTML 加载回退替换为内容。
  
  ¥optional onShellReady: A callback that fires right after the shell has finished. You can call pipe here to start streaming. React will stream the additional content after the shell along with the inline <script> tags that replace the HTML loading fallbacks with the content.
- 可选 onShellError：如果渲染 shell 时出现错误，则触发回调。它接收错误作为参数。流中尚未发出任何字节，onShellReady 和 onAllReady 都不会被调用，因此你可以使用输出一个 fallback HTML shell 或使用 prelude。
  
  ¥optional onShellError: A callback that fires if there was an error rendering the shell. It receives the error as an argument. No bytes were emitted from the stream yet, and neither onShellReady nor onAllReady will get called, so you can output a fallback HTML shell or use the prelude.

¥Returns

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

¥resume returns an object with two methods:

pipe 将 HTML 输出到提供的可写的 Node.js 流。如果要启用流，则在 onShellReady 中调用 pipe，或者在 onAllReady 中用于爬虫和静态生成。

¥pipe outputs the HTML into the provided Writable Node.js Stream. Call pipe in onShellReady if you want to enable streaming, or in onAllReady for crawlers and static generation.
abort 让你中止服务器渲染并在客户端渲染其余部分。

¥abort lets you abort server rendering and render the rest on the client.

注意事项

¥Caveats

resumeToPipeableStream 不接受 bootstrapScripts、bootstrapScriptContent 或 bootstrapModules 的选项。相反，你需要将这些选项传递给生成 postponedState 的 prerender 调用。你还可以手动将引导内容注入可写流。

¥resumeToPipeableStream does not accept options for bootstrapScripts, bootstrapScriptContent, or bootstrapModules. Instead, you need to pass these options to the prerender call that generates the postponedState. You can also inject bootstrap content into the writable stream manually.
resumeToPipeableStream 不接受 identifierPrefix，因为前缀在 prerender 和 resumeToPipeableStream 中必须相同。

¥resumeToPipeableStream does not accept identifierPrefix since the prefix needs to be the same in both prerender and resumeToPipeableStream.
由于无法将 nonce 提供给预渲染，因此如果你不提供脚本来提供预渲染，则应仅提供 nonce 至 resumeToPipeableStream。

¥Since nonce cannot be provided to prerender, you should only provide nonce to resumeToPipeableStream if you’re not providing scripts to prerender.
resumeToPipeableStream 从根节点重新渲染，直到找到未完全预渲染的组件。只有完全预渲染的组件（组件及其子组件已完成预渲染）才会被完全跳过。

¥resumeToPipeableStream re-renders from the root until it finds a component that was not fully pre-rendered. Only fully prerendered Components (the Component and its children finished prerendering) are skipped entirely.

用法

¥Usage

延伸阅读

¥Further reading

恢复行为与 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