JavaScript 网站与 AI 爬虫:它们能看到您的页面吗?
为什么在浏览器里看起来正常的网站,在 AI 爬虫眼中可能是空的,Google 对渲染 JavaScript 怎么说,如何测试机器人实际收到了什么,以及对小企业网站有效的修复方法。
许多现代网站发给浏览器的是一个几乎空白的 HTML 文件,外加一包在加载时构建页面的 JavaScript。普通人从不会察觉,爬虫却可能会。如果机器人只读 HTML 而不运行脚本,您精心撰写的服务页面在它看来,就是一张只有标志的白纸。
Google 如何处理
Google 搜索中心的 JavaScript SEO 基础知识解释说,Googlebot 会抓取页面,把它排入队列,用较新版本的 Chromium 进行渲染,然后对渲染结果编入索引。所以 Google 能看到 JavaScript 内容,只是渲染可能晚于第一次抓取。Google 仍然建议使用服务端渲染或预渲染,因为这对用户和所有爬虫来说都更快。其指南还提醒,链接必须是带有 href 的真正锚点标签才会被跟踪。
AI 爬虫如何处理
AI 公司对渲染说得更少。OpenAI 介绍了 OAI-SearchBot 和 GPTBot,Perplexity 介绍了 PerplexityBot,但这些页面都没有承诺爬虫会执行 JavaScript。Vercel 在 2024 年 12 月对其网络上爬虫流量的分析发现,它所测量的主要 AI 爬虫都不渲染 JavaScript,点名了 OpenAI 和 Anthropic 的爬虫以及 PerplexityBot。它发现了两个例外:使用 Googlebot 基础设施的 Gemini,以及 Applebot。爬虫会变化,所以请把这当作一张快照,而不是承诺。
稳妥的假设是:如果文字不在您服务器发送的 HTML 中,ChatGPT 搜索、Perplexity 和类似工具可能就看不到。
测试爬虫收到了什么
- 打开页面,选择“查看网页源代码”(不是“检查”,后者显示的是脚本运行后的页面)。搜索主标题中的一句话。如果能找到,说明文字在原始 HTML 中。
- 在 Google Search Console 中使用网址检查,再点“查看已抓取的网页”,就能看到 Google 存储的 HTML 和渲染截图。
- 在终端里用普通请求获取页面,看看返回了什么。如果只看到一个根 div 和若干脚本标签,那么不渲染的爬虫什么也拿不到。
- 在浏览器设置中关闭 JavaScript 并重新加载。剩下的内容,大致就是不渲染的机器人能读到的。
修复方法,从最稳妥到最不稳妥
- 服务端渲染或静态生成。服务器发送已完成的 HTML。Next.js、Nuxt 和 Astro 等框架都支持,许多建站工具本身就生成静态页面。
- 预渲染。通过构建步骤或服务为每个页面保存一份完整的 HTML 快照。只要机器人和人看到的内容相同,Google 就认为这是可以接受的。
- 把关键事实放进初始 HTML。如果无法重建网站,至少在服务器端渲染名称、服务、区域、营业时间和联系方式。
避免使用给机器人和真人提供不同页面的动态渲染。Google 把动态渲染描述为权宜之计,而不是长期方案;机器人与访客看到不同内容,就越界成了伪装。
小企业网站的常见陷阱
- 文字放在图片或轮播图里,没有爬虫会把它当作文字读取。
- 菜单用带点击事件的按钮而不是链接构建,导致内页永远不会被发现。
- 评价、价格或常见问题在页面加载后由第三方小组件载入。
- 首页在服务器端渲染,内页却没有。
每次改版后都要检查
渲染问题往往随着新主题或新插件一起出现。任何大的改动之后,都要对首页和两个内页重复一遍源代码检查。
We.Inc 网站以 Google 能读取的 HTML 提供内页,SEO God Mode 在此基础上,每周根据您自己的服务添加新的可读页面。
常见问题
Googlebot 会运行 JavaScript 吗?
会。Google 在编入索引前会用较新的 Chromium 渲染页面,不过渲染可能晚于第一次抓取。Google 仍建议尽可能使用服务端渲染或预渲染。
ChatGPT 和 Perplexity 的爬虫会运行 JavaScript 吗?
它们的文档没有说会,Vercel 2024 年的爬虫分析也发现它们不渲染 JavaScript。请把重要文字放在服务器发送的 HTML 中。
如何看到爬虫看到的内容?
在浏览器中使用“查看网页源代码”,或在 Google Search Console 中使用网址检查和“查看已抓取的网页”。如果那里缺少您的文字,不渲染的机器人也会漏掉它们。
免费开始 · 无需信用卡
相关内容: 指南
- 珠寶店網站指南:頁面、費用和實作範例
- 澳大利亚企业的本地引用:应该在哪里上架
- 加拿大企业的本地引用:实用清单
- 英国企业的本地引用:真正重要的商家信息
- 美国企业的本地引用:在哪里上架、为什么
- 本地企业的竞争对手差距分析
- 做地区页面,又不踩“门页”风险
- 行動優先網頁設計:概念與實作方法
产品
适用对象
功能
资源
- 博客
- 帮助中心
- 免费商业工具
- Free UI Components
- 模板
- 模板合集
- 网站示例
- 指南
- 对比
- 替代方案
- 精选推荐
- 评测
- 价格指南
- 使用场景
- 术语表与指南
- 集成
- 开发者
- Benchmark
- Windows App