SSR 报错或内容跳变怎么处理
先理解原理和示例,再练习完整口述与追问。
回答要点
环境隔离;初始一致;用户状态隔离。
原理拆解
SSR 的模块可能同时在服务端和客户端执行,服务端没有 window/document。水合则要求客户端初次渲染与服务器输出可对应。浏览器专用依赖、随机值、时间时区差异、请求间共享状态和客户端立即覆盖首屏数据,是不同根因,需要逐一定位。
示例与推演
先用报错堆栈定位是否在模块 import 阶段读取 window;如果是,只在 mounted 里调用某方法仍不够,需要客户端插件或条件动态导入。若是文本水合差异,记录服务端序列化值与客户端初始值,统一数据来源,浏览器专用内容用一致占位再增强。
易错点
不能用全站关闭 SSR 或压制警告掩盖局部问题。服务端敏感状态必须按请求创建,不能为消除差异把用户 token 全量序列化到 HTML。
参考回答可直接练习口述
首先排查服务端模块顶层是否访问 window/document,以及密钥或用户状态是否错误共享。然后对比服务端与客户端首轮输出,去掉随机值、时区差异、非法结构和仅客户端立即可知的状态。浏览器专用能力在挂载后执行,保持可预测的初始占位。框架名称不同,但 SSR 与水合一致性、用户隔离这些边界相同。