跳到主要内容

服务端渲染错误与输出

流开始前后怎样处理失败与超时？​

  • 外壳范围: html、head、body、Suspense 外的布局与各边界 fallback，它们构成首批可用页面;
  • 外壳失败: 这些必要内容抛错时，Web API 的 Promise 拒绝，Node API 调用 onShellError；因响应尚未发送，可返回 500 后备页;
  • 边界内失败: Suspense children 在服务端抛错时，React 保留该边界 fallback、继续其他输出，并在客户端重试真实内容;
  • 重试结果: 客户端成功则替换 fallback；仍失败则交给最近的错误边界，Suspense 本身不是客户端错误提示;
  • 取消工作: Node 使用 abort，Web 使用 AbortSignal；中止未完成渲染后可让客户端接手剩余边界;
Header 抛错（边界外）     → 外壳失败，返回后备响应
PostList 抛错（边界内） → 保留 PostsSkeleton，客户端重试
PostsSkeleton 抛错         → 当前边界无法保护自己的 fallback，继续向外传播

什么时候需要等待全部内容或同步字符串？​

  • 完整输出: 爬虫或静态生成需要全量内容时，Node 可等待 onAllReady，Web 可等待 stream.allReady;
  • renderToString: 同步返回可水合 HTML，但不等待挂起数据，而是立即输出最近 Suspense fallback;
  • renderToStaticMarkup: 输出不用于 React 水合的静态 HTML，适合邮件等场景，与可水合的静态预渲染不能混淆;

如何继续先前推迟的渲染？​

  • 恢复输入: resume 或 resumeToPipeableStream 接收同一应用树与 prerender 得到的 postponed 数据，分别返回 Web 或 Node 流形态;
  • 保持一致: 恢复过程要与先前树和数据对应，postponed 是不透明状态，不自行编辑内部结构;
  • 配置协调: bootstrap、identifierPrefix、资源提示和错误回调应与客户端入口及部署环境一致;