技术实现
Next.js 网站检查:AI 和搜索系统实际能读到什么
不要争论“爬虫会不会执行 JavaScript”,直接比较它实际收到的三份内容。
先讲人话:浏览器看得到,不等于首次请求拿得到
Next.js 页面可能在服务器输出完整 HTML,也可能先返回空容器,再由浏览器执行 JavaScript 请求数据。人类看到的最终页面相同,但不同抓取系统获得的内容可能不同。
不要争论“爬虫会不会执行 JavaScript”,直接比较它实际收到的三份内容。
一、比较三种页面状态
- 初始 HTML:服务器首次返回的源代码;
- 渲染后 DOM:JavaScript 执行后的页面结构;
- 交互后内容:点击标签、登录或请求接口后才出现的信息。
重点核对:定位、功能、价格、限制、作者、日期、正文和内链。
二、Next.js 常见渲染方式
| 方式 | 通俗解释 | 检查重点 |
|---|---|---|
| 静态生成 | 构建时生成 HTML | 内容更新是否及时重新构建 |
| 服务端渲染 | 请求时由服务器生成 HTML | 响应速度、错误与缓存 |
| React Server Components | 服务端生成主要内容 | 客户端边界是否隐藏关键信息 |
| 客户端渲染 | 浏览器加载后再获取内容 | 初始 HTML 是否为空、接口是否受阻 |
Google 官方说明能处理未被阻挡的 JavaScript,但 JavaScript SEO 更复杂;其他 AI 访问系统的执行能力不能直接假定。JavaScript SEO basics
三、最低检查方法
curl -L "https://example.com/pricing"在返回内容中检查套餐名、价格和限制是否存在。然后在浏览器渲染后再次检查 DOM。
注意:命令只是请求证据,不模拟所有搜索引擎。不要通过伪造 User-Agent 得出平台已经成功抓取的结论。
四、检查元数据和规范信号
确认初始 HTML 中具有:
- 唯一、准确的
<title>; - 与页面主题一致的描述;
- 正确的 canonical;
- 适用的语言信息;
- 不存在误加的 noindex;
- 与正文一致的结构化数据。
对于 App Router,优先使用稳定的 metadata 配置,不要让客户端脚本在加载后把 canonical 或 robots 改成另一套值。
五、检查真实失败模式
- 页面返回 200,但正文是“Loading…”;
- 定价通过客户端 API 加载,而接口需要 Cookie;
- Bot 被中间件重定向到登录页;
- 异常处理把 404 页面返回为 200;
- 多语言路由 canonical 全指向首页;
- 预览环境被索引;
- ISR 或缓存长期保留旧价格;
- accordion 内关键内容没有稳定 DOM。
六、生成正文对照报告
| 页面 | 初始 HTML | 渲染后 DOM | 交互后 | 风险 |
|---|---|---|---|---|
| 首页 | 有定位 | 一致 | 无新增关键事实 | 低 |
| 定价页 | 无价格 | 有价格 | 切换年付后变化 | 高 |
| 文档页 | 有正文 | 一致 | 示例按需展开 | 低 |
优先修复“初始 HTML 缺少购买决策事实”的页面。
七、修复原则
- 公开核心内容优先服务端输出;
- 客户端交互用于增强体验,不承担唯一事实来源;
- 错误页面返回真实 404/410;
- 缓存失效与产品变更流程联动;
- 关键 URL 在 Sitemap、canonical 和内链中一致;
- 上线后重新请求生产环境,而不是只看本地预览。
本文行动清单
- 已比较初始 HTML、渲染 DOM 和交互后内容。
- 核心定位、价格、限制与正文无需交互即可读取。
- 404、重定向和缓存状态正确。
- title、robots、canonical 和语言信号稳定一致。
- 生产环境未把 Bot 重定向到登录或挑战页。
- 已形成逐 URL 的正文对照报告。
小结
Next.js 本身不是 SEO 或 GEO 问题;不可预测的渲染、缓存和访问路径才是问题。
最可靠的页面,是首次响应就能说明自己是谁、提供什么以及有什么限制。
最后更新于