服务端渲染

Server-Side Rendering

前端工程也叫：SSR、服务器端渲染、服务端直出

一句话：用户每次访问时，由服务器先把页面生成完整的 HTML 再发给浏览器，首屏快，也利于搜索引擎收录。

详细解释

如果 SPA 是给你一盒食材回家自己做，SSR 就是餐厅做好端上桌：浏览器拿到的 HTML 已经有内容，马上能看到页面，之后再加载 JavaScript 让按钮等交互生效，这一步叫水合（Hydration）。

SSR 适合需要被搜索引擎收录、且每次访问数据都可能不同的页面，比如商品详情页、新闻页。它和 SSG 的区别在于 HTML 生成的时机：SSR 在每次请求时，SSG 在构建时。Next.js、Nuxt 是常见的 SSR 框架，代价是需要一台一直运行的服务器。

新手常见报错是 hydration mismatch：服务器生成的内容和浏览器首次渲染的不一致，通常因为渲染时用了 window、localStorage、当前时间或随机数。

可以直接贴给 Cursor、Claude Code 等工具，把里面的业务内容换成你自己的。

这是 Next.js 项目，页面控制台报 hydration mismatch 错误。请找出服务端和浏览器渲染结果不一致的地方（比如用到了 window、localStorage 或当前时间），改成只在浏览器端执行，并说明改动原因。