Facebook的刮板和角应用HTML5Mode Hashbang网址 [英] Facebook Scrapper and Angular App with HTML5Mode Hashbang urls
问题描述
我在角添加应用程序支持的搜索引擎优化
I added seo support in my Angular app
我配置Html5Mode包括Hashbang网址
I configured Html5Mode including Hashbang urls
$locationProvider.html5Mode(true).hashPrefix('!');
通过这样做，这两个URL都是有效的。
By doing this both urls are valid
http://staging.lovented.com/contest/extension_test_contest
http://staging.lovented.com/#!/contest/extension_test_contest
然后我设置的元标签，如
Then I setup the meta tags like
<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标签，谷歌通过附加抓取网站的方式逃脱片段的URL和系统年底将采取快照。您可以点击下面的链接，看到页面的源代码。一切都在那里。
the meta tags set dynamically, the way google crawl the site by appending escaped fragment at the end of url and system will take the snapshot. You can click on the below link and see the source of the page. Everything is there.
的http://staging.lovented.com/contest/extension_test_contest?_escaped_fragement_=
不过，Facebook的方式履带会的工作，它看起来＃！在URL和逃脱片段取代它所以FB分享我会分享这个网址的http：// staging.lovented.com/#!/contest/extension_test_contest
But the way facebook crawler would work, it looks for #! in the url and replace it with escaped fragment so for fb share I would share this url http://staging.lovented.com/#!/contest/extension_test_contest
但是，如果我运行的网址，Facebook的调试器，它似乎不刮的部位。
But If I run this url in Facebook Debugger, it not seems to scrape the site.
https://developers.facebook.com/tools/debug/og/object /
所以，谷歌爬虫肯定会工作，但我不知道为什么没有FB我刮页面。任何建议吗？
So, Google crawler would definitely work but I am not sure why Fb not scrape my page. Any suggestion please?
推荐答案
这是因为Facebook不使用＆LT;！META NAME =片段CONTENT =＆GT; 刮的时候，所以如果没有＃在网址！ - Facebook将它取作为一个普通网页不增加 _escaped_fragment _ 查询参数...
It is because facebook is not using <meta name="fragment" content="!"> when scraping, so if there is no #! in url - facebook will fetch it as a regular page without adding _escaped_fragment_ query parameter…
这同样适用于其他社交网络真正的（至少是，当我在做搜索引擎优化为我的应用程序）...
The same is true for other social networks(at least it was, when I was doing SEO for my application)…
要解决这个问题，你可以添加基于用户代理检测。
有很好的例子如何从prerender.io来完成：
To handle this issue you can add detecting based on user agent. There is good examples how this can be done from prerender.io:
阿帕奇： https://gist.github.com/thoop/8072354
Nginx的： https://gist.github.com/thoop/8165802
这篇关于Facebook的刮板和角应用HTML5Mode Hashbang网址的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
