Facebook的刮板和角度应用与HTML5Mode Hashbang网址

Question

我加入搜索引擎支持我的角度应用

http://staging.lovented.com

我配置Html5Mode包括Hashbang网址

$locationProvider.html5Mode(true).hashPrefix('!'); 

通过这样做，这两个URL都是有效的

http://staging.lovented.com/contest/extension_test_contest

http://staging.lovented.com/#!/contest/extension_test_contest

然后我设置的元标签，如

<meta name="description" content="{{description}}"> 

<!--Facebook Meta Tags--> 
<meta property="og:title" content="{{title}}" /> 
<meta property="og:url" content="{{siteUrl}}#!{{contentUrl}}" /> 
<meta property="og:description" content="{{description}}" /> 
<meta property="og:image" content="{{serviceUrl}}{{imageUrl}}" /> 

如果我去这个页面动态设置http://staging.lovented.com/contest/extension_test_contest

meta标签，谷歌将在年底追加逃脱片段抓取网站的方式的网址和系统将拍摄快照。您可以点击下面的链接并查看页面的来源。一切都在那里。

http://staging.lovented.com/contest/extension_test_contest?_escaped_fragement_=

但Facebook的方式将履带工作，它看起来＃！在URL中，并将其替换为转义片段，以便fb分享我将分享此URL http://staging.lovented.com/#!/contest/extension_test_contest

但是，如果我在Facebook调试器中运行此URL，它似乎并没有刮擦网站。

https://developers.facebook.com/tools/debug/og/object/

所以，谷歌爬虫肯定会工作，但我不知道为什么不Fb的刮我的网页。有什么建议吗？

Answer 1

这是因为拼抢当Facebook没有使用<meta name="fragment" content="!">，所以如果在URL没有#! - Facebook将它取作为一个普通网页不增加_escaped_fragment_查询参数......

这同样适用于其他社交网络真（至少是当我为我的应用程序做搜索引擎优化时）...

要处理此问题，您可以添加基于用户代理的检测。 有很好的例子如何从prerender.io做到：

阿帕奇：https://gist.github.com/thoop/8072354

Nginx的：https://gist.github.com/thoop/8165802