resumeToPipeableStream

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

• Справочник
  • resumeToPipeableStream(node, postponed, options?)
• Использование
  • Дополнительная информация

Справочник

resumeToPipeableStream(node, postponed, options?)

Вызовите resume, чтобы продолжить отрисовку предварительно отрисованного дерева React в HTML и передать его в поток Node.js для записи.

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);
    }
  });
}

Ниже приведены дополнительные примеры.

Параметры

• reactNode: узел React, с которым вы вызвали prerender. Например, JSX-элемент, такой как <App />. Предполагается, что он представляет весь документ, поэтому компонент App должен отрисовать тег <html>.
• postponedState: непрозрачный объект postpone, возвращённый API предварительной отрисовки и загруженный из места, где вы его сохранили (например, из Redis, файла или S3).
• необязательный options: объект с параметрами потоковой передачи.
  • необязательный nonce: строка nonce, разрешающая выполнение скриптов для политики безопасности содержимого script-src.
  • необязательный signal: сигнал отмены, позволяющий прервать серверную отрисовку и отрисовать остальную часть на клиенте.
  • необязательный onError: функция обратного вызова, вызываемая при возникновении ошибки на сервере — восстановимой или нет. По умолчанию она вызывает только console.error. Если вы переопределите её, чтобы записывать отчёты о сбоях в журнал, обязательно также вызывайте console.error.
  • необязательный onShellReady: функция обратного вызова, вызываемая сразу после завершения оболочки. Здесь можно вызвать pipe, чтобы начать потоковую передачу. React будет передавать дополнительное содержимое потоком после оболочки вместе со встроенными тегами <script>, которые заменяют HTML-заглушки загрузки содержимым.
  • необязательный onShellError: функция обратного вызова, вызываемая при ошибке отрисовки оболочки. Ошибка передаётся ей в качестве аргумента. Поток пока не передал ни одного байта, а функции onShellReady и onAllReady не будут вызваны, поэтому вы можете вывести резервную HTML-оболочку или использовать прелюдию.

Возвращаемое значение

resume возвращает объект с двумя методами:

• pipe записывает HTML в предоставленный поток Node.js для записи. Вызовите pipe в onShellReady, если хотите включить потоковую передачу, или в onAllReady для поисковых роботов и статической генерации.
• abort позволяет прервать серверную отрисовку и отрисовать остальную часть на клиенте.

Ограничения

• resumeToPipeableStream не принимает параметры для bootstrapScripts, bootstrapScriptContent или bootstrapModules. Вместо этого передайте эти параметры вызову prerender, который создаёт postponedState. Вы также можете вручную добавить начальное содержимое в поток для записи.
• resumeToPipeableStream не принимает identifierPrefix, поскольку префикс должен быть одинаковым в prerender и resumeToPipeableStream.
• Поскольку nonce нельзя передать в предварительную отрисовку, следует передавать nonce в resumeToPipeableStream, только если вы не передаёте скрипты для предварительной отрисовки.
• resumeToPipeableStream выполняет повторную отрисовку от корня, пока не найдёт компонент, который не был полностью отрисован заранее. Полностью предварительно отрисованные компоненты (компонент и все его потомки завершили предварительную отрисовку) пропускаются целиком.

Использование

Дополнительная информация

Возобновление работает так же, как renderToReadableStream. Другие примеры см. в разделе об использовании renderToReadableStream. В разделе об использовании prerender приведены примеры использования именно prerenderToNodeStream.