html5mode(true)是否会影响Google搜索抓取工具

时间:2015-07-15 18:03:08

标签: javascript angularjs web-crawler google-crawlers

我正在阅读this specification,这是网络服务器和搜索引擎抓取工具之间的协议,允许抓取工具看到动态创建的内容。 在那里声明,为了使爬虫能够索引html5应用程序,必须使用URL中的#!实现路由。在角度html5mode(true)中,我们摆脱了URL的这个散列部分。我想知道这是否会阻止抓取工具索引我的网站。

2 个答案:

答案 0 :(得分:12)

简短回答 - 不,html5mode不会搞砸你的索引,但请继续阅读。

重要提示:Google和Bing都可以抓取基于AJAX的内容而无需HTML快照

我知道,你链接到的文档说不然但是大约一年或两年前他们正式宣布他们处理AJAX内容而不需要HTML快照,只要你使用pushstates,但是很多文档很旧,遗憾的是没有更新。

使用pushstates的SEO

AJAX抓取开箱即用的要求是您使用pushstates更改网址。这正是Angular中的html5mode(以及许多其他框架所做的)。当pushstates开启时,爬虫会等待ajax调用完成,并且javascript会在它们编制索引之前更新页面。您甚至可以在路由器中更新页面标题甚至元标记等内容,它将正确编制索引。从本质上讲,您不需要做任何事情,在这种情况下,服务器端和客户端呈现的站点之间没有区别。

很明显,许多SEO分析工具(如Moz)会在使用pushstates的页面上发出警告。那是因为这些工具(以及他们与他们交谈的代表)在撰写本文时尚未达到最新状态,因此请忽略它们。

最后,确保您在执行此操作时使用下面的片段元标记。如果你有这个标记,爬虫会认为你想使用非pushstates方法,事情可能会搞砸。

没有州的SEO

没有理由不使用带有Angular的pushstates,但如果不这样做,则需要遵循问题中链接的指南。简而言之,您在服务器上创建html的快照,然后使用片段元标记将您的url片段更改为“#!”而不是“#”。

<meta name="fragment" content="!" />

当抓取工具找到这样的页面时,它会删除网址的片段部分,而是使用参数_escaped_fragment_请求网址,您可以提供快照页面作为响应。为爬虫提供正常的静态页面以进行索引。

请注意,只有在您想要触发此行为时才应使用片段元标记。如果您正在使用pushstates并希望页面以这种方式编制索引,请不要使用此标记。

此外,在Angular中使用快照时,可以打开html5mode。在html5mode中,片段是隐藏的,但它仍然在技术上存在,并且仍会触发相同的行为,假设片段元标记已设置。

警告 - Facebook抓取工具

虽然Google和Bing都会毫无问题地抓取您的AJAX页面(如果您使用的是pushstates),Facebook则不会。 Facebook不了解ajax内容,仍然需要特殊的解决方案,例如专门为facebook bot(用户代理facebookexternalhit / 1.1)提供的html快照。

编辑 - 我应该提一下,我已经部署了所有这些版本的网站。使用html5mode,片段元标记和快照,没有任何快照,只依赖于pushstate-crawling。一切正常,除了上面提到的pushstates和Facebook。

答案 1 :(得分:0)

要允许为AJAX应用程序建立索引,您必须在文档的head部分添加特殊元标记:

<meta name="fragment" content="!" />

来源: https://docs.angularjs.org/guide/$location#crawling-your-app

向下搜索抓取您的应用