搜索抓取

链接藏在 JS 里:蜘蛛拿到的首屏 HTML 为什么没有可走的路径

蜘蛛先拿到的是服务器返回的 HTML,渲染是后一步且不一定发生。如果链接只存在于 JS 渲染之后,新 URL 就进不了抓取队列。本文梳理容易造成 URL 发现断档的几种写法,介绍服务端渲染、预渲染和 HTML 兜底清单的做法,并给出用页面源码、无 JS 访问和服务器日志自查的具体步骤。

搜索抓取

链接藏在 JS 里:蜘蛛拿到的首屏 HTML 为什么没有可走的路径

蜘蛛先看到的是 HTML,不是渲染后的页面

大多数搜索引擎的抓取分两步走:先请求 URL,拿到服务器返回的 HTML;如果资源允许,再排队执行页面里的 JS,把渲染后的 DOM 解析一遍。问题在于第二步不是必然发生,也常被延后。如果链接只存在于渲染之后,蜘蛛在第一轮就只能看到一个空壳,新 URL 自然进不了待抓取队列。

哪些写法容易让 URL 发现断档

  • 列表、卡片用 div 加 onclick 或事件监听跳转,HTML 里根本没有 href。
  • 分页用按钮加前端状态管理,翻页不改变地址,蜘蛛分不清“下一页”在哪。
  • 用 hash 路由,例如 /list 后面挂 #page=2,这段通常不会作为独立 URL 被抓取。
  • 相关内容、推荐位在首屏之后异步加载,且没有任何静态兜底。
  • 整站共用一套前端模板,源码里只有一个挂载节点和一段打包脚本。

这几类写法的共同点是:用户看得见,蜘蛛第一轮看不见。

把路径交出去的几种做法

服务端渲染或静态生成

首屏 HTML 直接带上 a 标签,是把发现成本降到最低的方案。列表页、详情页、导航区这些“路径节点”尤其值得优先处理,蜘蛛不需要等 JS 就能顺藤摸瓜。

预渲染关键入口

暂时改不动整站架构时,可以对分类页、文章列表页、专题页做预渲染,把链接写进 HTML。覆盖主要入口即可,不必追求全站都渲染。

用 HTML 兜底清单

在页面底部或一个专门的“全部内容”页面里,用真实 a 标签列出各栏目入口。即使主列表是 JS 渲染的,蜘蛛也有路可走。注意别做成几千条链接的大杂烩,按栏目分组、控制数量,兜底清单是补充,不是堆链接的地方。

Sitemap 与内链是兜底,不是替代

Sitemap 能帮助发现 URL,但它不表达页面之间的关系;内链的锚文本和层级,才决定蜘蛛先走哪条路、走多深。两条都做,只是把可发现性补齐,并不意味着蜘蛛一定会来抓。

怎么自查有没有断档

  1. 关掉 JS 打开页面,看主要链接是否还点得到。
  2. 查看页面源码而不是审查元素,搜索 href 是否真的出现在源码里。
  3. 用服务器日志比对:日志里出现过的 URL 数量,和站点实际 URL 数量差多少,差距大的通常是 JS 渲染的栏目。
  4. 抽几个新发布的页面,看它们第一次被请求时,入口来自哪里。

渲染链路的稳定性也在影响抓取

依赖前端渲染的站点,对外部接口和资源的依赖更多。接口慢、超时、间歇性 5xx 出现时,蜘蛛拿到的 HTML 可能是残缺的,链接自然也残缺。服务器稳定性和渲染链路的稳定性,本质上是同一条抓取路径上的两段。

让每个重要页面在“没有 JS 的世界”里也有一条走得通的路,是 URL 发现里最省事的一道保险。