AngularJS 百度SEO怎么做？这几个技巧要知道！

今儿跟大伙儿聊聊我最近折腾的一个事儿：用 AngularJS 搞百度 SEO。一开始真把我给难住，不过好歹是趟过来，现在就来分享分享我的实战经验。

第一步：发现问题

我这网站用 AngularJS 搭的，单页面应用嘛用起来是挺爽，但很快就发现不对劲。百度根本搜不到我的网站！这可不行，辛辛苦苦做的东西，没人看怎么行？

后来一查，原来是 AngularJS 这框架对搜索引擎不友为啥？因为 AngularJS 返回的是 HTML 模板，具体内容得等 JS 执行完才会填充进去。百度那爬虫可等不及，直接就走，啥也抓不到。

第二步：寻找解决方案

知道问题，就得找解决办法。网上搜一圈，发现不少人都遇到过类似的问题。主要有这么几个思路：

• 预渲染 (Prerender)： 简单来说，就是提前把 AngularJS 渲染好的页面准备等爬虫来，直接给它看现成的。
• 服务器端渲染 (SSR)： 这玩意儿更高级点，直接在服务器端就把页面给渲染不管是用户还是爬虫，看到的都是完整页面。
• 修改 AngularJS 代码： 有些插件或者代码片段，可以帮助 AngularJS 动态更新页面的标题和 meta 标签，这对 SEO 也有帮助。

第三步：我的选择和实践

考虑一下我的实际情况，服务器端渲染感觉有点复杂，我这小网站也用不着。我决定试试预渲染，再配合一些 AngularJS 的插件。

1. 搭建 Prerender 服务：

我找个 Prerender 的服务，照着教程一步步搭起来。这玩意儿的作用，就是能把 AngularJS 渲染好的页面给缓存起来。

2. 修改 *（这步很重要！）：

光有 Prerender 服务还不行，还得让服务器知道啥时候该用它。我修改 * 文件，加一些配置。大概意思就是：

• 如果是普通用户访问，就正常显示页面，该咋访问咋访问。
• 如果是百度爬虫来，就让它去看 Prerender 服务缓存好的页面。

3. 使用 AngularJS 插件：

我还找个叫“angular-update-meta”的 AngularJS 插件。这小东西挺厉害，能帮我动态更新页面的标题和 meta 标签。这样一来，每个页面的信息都能更准确地被百度抓取到。

4.引入seo模块

在angular添加一个模块‘seo’，引入文件 *文件。这样的话也能让页面被抓取到。

第四步：效果验证

折腾完这一通，我赶紧去百度搜搜，还真能搜到我的网站！虽然排名还不算靠前，但起码是个好的开始。我打算再研究研究关键词优化，争取让排名再往上提一提。

这回折腾 AngularJS 的百度 SEO，算是给我上一课。单页面应用虽然好用，但在 SEO 方面确实有点坑。不过只要找对方法，还是能解决问题的。希望我的经验能给大伙儿一些帮助！