搜尋抓取

搜尋蜘蛛URL發現:客戶端渲染頁面的連結可见性與入口补挂

前端改版後抓取量下降,很多时候是因為列表連結只存在于渲染後的 DOM 里,初始 HTML 中並不可见。本文给出源碼與渲染後 DOM 的對比自检方法,整理 onclick 跳轉、前端路由、滚動加载等常见寫法,並给出静態連結、分頁地址、面包屑、Sitemap 等补充入口的實操思路與上线後的观察指标。

搜尋抓取

搜尋蜘蛛URL發現:客戶端渲染頁面的連結可见性與入口补挂

很多站点在做完前端改版後,會發現抓取日誌里新增的 URL 明顯變少,但内容确實在更新。這類情况常常不是服務器問题,而是入口連結只存在于浏览器渲染後的 DOM 里,抓取工具拿到的初始 HTML 中什么都没有。連結既然没出現,後續的抓取自然無從谈起。

先確認:源碼里到底有没有連結

判断方法不复杂,關键是分別看初始 HTML 和渲染後 DOM 两個版本。

  • 用命令行或抓取工具直接取初始 HTML,統計其中的連結數量,只算指向站内、可点击的真實地址。
  • 在浏览器里打開同一頁面,用開發者工具查看渲染後的 DOM,再統計一次。
  • 如果两個數字差距很大,比如初始 HTML 只有導航和頁脚,渲染後却多出几十條列表連結,說明列表内容几乎完全依赖脚本注入。
  • 再看抓取日誌:如果抓取集中在首頁和少數栏目頁,詳情頁几乎没有入口记錄,基本可以印證上面的判断。

常见的連結隐形寫法

  • 用 div 或 span 加 onclick 做跳轉,没有 a 标簽和 href。
  • href 寫成 javascript:void(0),真實地址由脚本拼接。
  • 用前端路由切換頁面,地址栏變了,但 HTML 中没有對應的連結。
  • 列表在滚動到底部或点击更多之後才注入,初始视口内没有可抓的連結。
  • 分頁做成了按钮,缺少形如 /list/2、/list/3 的静態地址。

這些寫法對体驗未必差,但對 URL 發現並不友好。抓取工具通常不會执行复杂的交互,滚動加载和点击展開的内容往往拿不到。

补充入口的几種做法

  1. 保留一份静態連結:首屏列表用服務端渲染或预渲染輸出真實的 a 标簽,脚本只负责增强交互。
  2. 分頁给出可訪問地址:頁碼路径用 a 标簽承载,即使视觉上是按钮,也要有可点击的真實連結。
  3. 面包屑與相關阅讀内鏈:這两類位置结构稳定、數量可控,适合長期作為詳情頁的补充入口。
  4. 站点地图兜底:把重要詳情頁寫入 Sitemap,作為脚本渲染之外的發現渠道,但不要指望它替代内鏈。
  5. 栏目與专题頁:為更新频繁的内容维護一個静態聚合入口,减少對客戶端渲染的依赖。

分頁與篩選要分清主次

篩選和排序參數容易把入口摊薄。建议只把有稳定内容、會長期存在的列表地址纳入入口体系,临时组合參數通過 robots.txt 或頁面上的 nofollow 收敛,避免把抓取预算耗在随时會變的路径上。

入口數量不等于抓取價值。一條能稳定到達詳情頁的連結,通常比几十條參數不同的临时連結更有用。

改動上线後看什么

  • 抓取日誌中入口連結的命中次數是否回升,尤其是之前為零的詳情頁。
  • 新增 URL 的發現速度,观察從列表頁出現到詳情頁被抓取的間隔。
  • 抓取工具是否仍在反复請求同一批參數頁,若是則繼續收敛。
  • 服務器返回狀態是否稳定,避免渲染服務压力带来間歇性 5xx。

改造不必一次到位,可以先從更新最频繁的栏目頁開始,把静態連結补上,再逐步覆盖其他模板。上线後按周對比日誌,比一次性大改更容易看清哪一步起了作用。