网站收录

页面内容靠 JavaScript 渲染:蜘蛛关掉脚本后能看到什么

浏览器里显示正常的页面,蜘蛛拿到原始 HTML 时可能只有一个空容器。本文说明原始 HTML 与渲染后 DOM 的区别,列出容易让正文、内链变得不可见的几种写法,并给出用禁用脚本、查看源码、核对日志来自查的顺序和处理优先级。

网站收录

页面内容靠 JavaScript 渲染:蜘蛛关掉脚本后能看到什么

很多人遇到过这种情况:浏览器里打开页面一切正常,标题、正文、图片都在,可是在搜索结果里搜自己的文章,要么搜不到,要么索引里的摘要是一段没有意义的占位文字。原因往往不在内容本身,而在于这段内容是浏览器执行脚本之后才出现的,蜘蛛第一次拿到的文件里并没有这些文字。

蜘蛛看到的其实是两个版本

抓取和收录是两个阶段。蜘蛛来取页面时,先拿到服务器直接返回的原始 HTML;是否再执行页面里的脚本、等页面渲染完成,属于后续的渲染环节,有单独的排队和资源限制。所以同一个地址可能有两个样子:

  • 原始 HTML:服务器一次性返回的内容,蜘蛛一进门就能读到。
  • 渲染后的页面结构:脚本跑完、数据拉回来之后拼出来的内容,需要额外一步。

如果正文、内链、价格、文章列表都只存在于第二个版本里,那么能不能被收录,就取决于渲染这一步有没有顺利发生。

哪几种写法最容易让内容变得不可见

  • 正文由前端框架在客户端请求接口后渲染,原始 HTML 里只有一个空的容器标签。
  • 重要内链写在脚本生成的菜单里,返回的 HTML 中并不存在这些链接。
  • 大量使用懒加载,图片和列表项要滚动或触发事件才插入。
  • 渲染时依赖额外的接口请求,而这些接口恰好被 robots.txt 挡住,或者需要登录态。
  • 渲染阶段超时,脚本还没跑完,抓取窗口就结束了。

这些写法本身不算错误,浏览器体验通常也没问题,但对能不能被稳定索引来说,多了一层不确定性。

怎么自查:把脚本关掉看一眼

  1. 用浏览器开发者工具禁用 JavaScript,刷新页面,看正文、标题、主要内链还剩多少。
  2. 查看网页源代码(不是审查元素),确认关键文字是否出现在服务器返回的 HTML 里。
  3. 用搜索资源平台提供的抓取测试工具,对比原始返回和渲染后内容的差异。
  4. 翻服务器日志,看渲染相关的请求是否成功、是否有大量超时。
  5. 在搜索框里用 site:你的域名 加上文章标题里的关键词,观察索引里的摘要取自哪一段文字。
判断标准可以简单一点:关掉脚本之后页面还剩下什么,那就是蜘蛛最省力能拿到的部分。这部分至少要能说清这是什么页面。

处理顺序的建议

不必把所有页面都改成纯静态,先分优先级:

  • 内容页、分类页这类靠自然搜索带流量的地址,优先保证核心正文和主要内链在原始 HTML 中可见。
  • 交互密集、登录后才使用的功能页,不必强求。
  • 如果短期内改不动架构,至少让标题、描述、主要正文段落做到服务端渲染或预渲染。
  • 渲染依赖的接口不要屏蔽蜘蛛,同时留意接口的响应速度。

还有两点容易忽略。第一,渲染成功不等于会被收录,索引阶段还要看页面质量和重复情况,渲染只是把内容交出去这一步。第二,如果同一份内容既有能直接读到的旧地址,又有只有渲染后才显示的地址,记得把地址收敛到其中一个,避免两个版本互相分散。

做站的人容易把注意力放在提交和抓取上,但真正影响收录的是蜘蛛在你的页面上读到了什么。每隔一段时间用关脚本的方式抽查几类模板,往往比反复提交更有效。