renderToStaticNodeStream

const stream = renderToStaticNodeStream(reactNode, options?)

• 参考
  • renderToStaticNodeStream(reactNode, options?)
• 用法
  • 将 React 树作为静态 HTML 渲染到 Node.js 可读流

参考

renderToStaticNodeStream(reactNode, options?)

在服务器上，调用 renderToStaticNodeStream 获取 Node.js 可读流。

import { renderToStaticNodeStream } from 'react-dom/server';

const stream = renderToStaticNodeStream(<Page />);
stream.pipe(response);

请参阅下面的更多示例。

该流将生成 React 组件的非交互式 HTML 输出。

参数

• reactNode：要渲染为 HTML 的 React 节点。例如，JSX 元素，如 <Page />。

• 可选 options：用于服务器渲染的对象。

  • 可选 identifierPrefix：React 用于 useId 生成的 ID 的字符串前缀。在同一页面上使用多个根目录时，这有助于避免冲突。

返回值

输出 HTML 字符串的 Node.js 可读流。生成的 HTML 无法在客户端上进行水合。

注意事项

• renderToStaticNodeStream 输出无法水合。

• 此方法将等待所有 Suspense 边界 完成后再返回任何输出。

• 从 React 18 开始，此方法会缓冲所有输出，因此实际上不会提供任何流式传输优势。

• 返回的流是采用 utf-8 编码的字节流。如果需要使用其他编码的流，请查看 iconv-lite 等项目，该项目提供了用于文本转码的转换流。

用法

调用 renderToStaticNodeStream 以获取 Node.js 可读流，您可以将其通过管道传输到服务器响应

import { renderToStaticNodeStream } from 'react-dom/server';

// The route handler syntax depends on your backend framework
app.use('/', (request, response) => {
  const stream = renderToStaticNodeStream(<Page />);
  stream.pipe(response);
});

该流将生成 React 组件的初始非交互式 HTML 输出。