你花大价钱搞的SPA，百度可能根本没看见

朋友昨天发我截图：“首页上线两周，百度搜 site:xxx.com，结果是空的。”
我点开他页面源码——<div id="app"></div>，后面跟着三行 <script>，再没别的了。

不是百度不努力，是你给它看的，本来就是个“空壳子”。

JS渲染到底卡在哪？百度抓取有三道坎

百度爬虫不是你电脑里那个 Chrome。它分两拨干活：

  • 第一拨叫“抓取蜘蛛”：只扒 HTML 源码，JS？不执行，直接跳过。
  • 第二拨叫“渲染蜘蛛”：会跑 JS，但排队、限速、超时全都有。等不及？直接放弃。

首屏内容全靠 JS 写进去

标题、描述、H1、正文……全在 mounted() 里用 this.$nextTick 塞进去？
抓取蜘蛛来的时候，看到的就是一个光秃秃的 <div id="app"></div>。
它连这页是卖课还是卖螺丝都猜不出来。

异步请求一卡，整页就“凉”

商品页的标题和价格得等接口返回才渲染？
渲染蜘蛛最多等几秒。接口慢一点、CDN抖一下、后端打个盹——它就走了。
我见过一个电商站，半年快照里标题一直是“加载中…”。

JS 报错，页面直接白屏

你本地跑得好好的，是因为 Chrome 新、Polyfill 全、API 都支持。
百度的渲染环境用的是旧版 Chromium，Promise.allSettled() 不认识，?. 可选链直接报错。
一行报错，后面所有 JS 停摆，内容全丢。

怎么判断你的页面被百度抓成了什么鬼？3个检查方法

别凭感觉，动手验证。

方法一：用百度搜索资源平台的“抓取诊断”

进 百度搜索资源平台 → 左侧菜单点「抓取诊断」→ 输入你的 URL → 点“开始诊断”。
重点看返回的 HTML 源码里有没有真实文字：

  • 有 H1、有产品名、有文章摘要？OK。
  • 只有 #app 和一堆 <script>？赶紧改。

有个做法律咨询的站，首页 H1 是 JS 动态插入的，诊断结果里连“律师团队”四个字都没有。

方法二：用 curl 模拟百度蜘蛛

打开终端，敲：

curl -H "User-Agent:Baiduspider" https://你的域名/

把返回结果粘到编辑器里 Ctrl+F 搜 title 或关键词。
如果搜不到，说明百度拿到的，跟你用户看到的，根本不是同一份内容。

我每次上线新项目，第一件事就是跑这句，确认核心文字已经躺在源码里。

方法三：看百度快照

在百度搜索框输入：site:你的域名 → 找一条已收录的链接 → 点右侧的「百度快照」。
快照里只有导航栏、底部版权，正文一片空白？
那不是百度不收录，是它压根没“看见”你写了啥。

有个旅游攻略站，快照里只显示“©2024 版权所有”，正文全军覆没，当天就切了 SSR。

解决JS渲染的3个硬核方案，别只靠预渲染

预渲染听着省事，但它只适合内容半年不动的页面。
博客要更新，商品要调价，订单要刷新——你总不能每分钟生成一次静态页吧？

方案一：服务端渲染（SSR）——最稳的路

用 Nuxt.js（Vue）或 Next.js（React），让页面在 Node 服务端就渲染成完整 HTML，再发给浏览器。
百度来的时候，看到的就是带标题、带正文、带 meta 的真·网页。

我帮一家 SaaS 工具站从纯 Vue 改成 Nuxt，首页当天被抓，内页一周内陆续进库，收录周期缩短了不少。
代价是服务器要跑 Node，但对大多数中小团队来说，这点成本远低于“半年没流量”的损失。

方案二：动态渲染（Dynamic Rendering）——折中但实用

在 Nginx 或 CDN 层加个判断：

  • User-Agent 是 Baiduspider？→ 返回预渲染的 HTML。
  • 其他是人？→ 正常走 JS 渲染。

工具用 Puppeteer 或 Rendertron 就行，不少公司 CDN 控制台里自带这个开关。
有个企业官网客户，用这招三周内补录了之前半年漏掉的所有产品页。
注意：预渲染的内容必须和用户看到的一致，否则百度会当成作弊。

方案三：混合渲染（Hybrid Rendering）——小改动，大改善

不用动架构，就在 HTML 源码里加一段 <noscript>：

<noscript>
  <h1>企业级 API 监控平台</h1>
  <p>实时追踪响应延迟、错误率、调用量，支持钉钉/企微告警。</p>
</noscript>

百度抓不到 JS，但能读到这段。至少让它知道你是干啥的。
试过几个站，收录率明显提升。缺点是关 JS 的用户看到简陋版——但说实话，现在谁还关 JS？

百度渲染蜘蛛到底有多“懒”？一个真实测试

去年我拿同一个 Vue 页面做了对比：

  • 纯客户端渲染版本：提交后一个月，百度抓了 3 次，每次返回都是 <div id="app"></div>。
  • 第二个月，渲染蜘蛛尝试了 2 次：第一次等了 8 秒，接口没回，放弃；第二次等了 5 秒，部分渲染成功，但懒加载图片没触发，关键图没被抓到。

换成 SSR 后：

  • 上线当天，首页被抓取；
  • 第二天，产品页、文档页陆续出现在收录列表里；
  • 百度资源平台里的“抓取异常”从每天报错，变成连续一周零异常。

它不是不想等，是真没时间等你。

别踩这3个坑，很多SEO老手都翻过车

坑一：用 Hash 路由（#/）

domain.com/#/article/123 → 百度只认 domain.com/，后面 # 一切全丢。
一个技术博客全用 Hash 路由，半年零收录。改成 History 模式后，两周收录量翻了三四倍。

坑二：关键内容塞进第三方 JS

比如用高德地图 API 动态加载门店地址，用 Disqus 加载评论区，甚至用字体 JS 渲染标题文字。
百度渲染时可能跨域失败、网络超时、API 不支持——内容直接消失。
核心信息：必须写死在服务端模板里，别指望第三方 JS 给你兜底。

坑三：JS 动态改 title 和 meta

document.title = '爆款课程｜限时99元'？
没用。百度抓取阶段就锁定了 <title> 标签的原始值，后续 JS 改的它根本不认。
我见过一个教育站，所有页面 title 都是“加载中…”，百度收录的标题全是这四个字。
<title> 和 <meta name="description">，必须在 HTML 源码里就写好。

今天就能执行的1个操作：用 curl 诊断你的首页

打开终端，复制粘贴这行（把 https://你的域名/ 换成你的真实首页地址）：

curl -H "User-Agent:Baiduspider" https://你的域名/ | grep -o '<title>[^<]*</title>'

看返回结果：
✅ 如果是 <title>你的真实网站名称</title> → 基础过关。
❌ 如果是空、或者 <title>加载中...</title>、<title>Vue App</title> → 今天必须改：
把 <title> 和 <meta name="description"> 从服务端模板里直接输出，别等 JS。

改完立刻回百度搜索资源平台，用「抓取诊断」再跑一次。
别等明天——百度蜘蛛每天都在你门口路过，你给它看什么，它就记什么。