Facebook与单页应用程序共享

问题描述:

此问题可能与确切的软件堆栈,框架或语言无关。Facebook与单页应用程序共享

对于我目前的项目,我们使用AngularJS来构建前端,它有一个不断的入口页面来加载真实数据和渲染,这对于CDN很容易,并且对于浏览器端的快速加载速度有好处。但对于某些社交功能,这样的架构师可能会导致一些问题。例如,当您将感兴趣的链接粘贴到Facebook门户分享时,Facebook将抓住您的页面并显示预览。如果着陆页是空的,则此预览不起作用。

(我听说最近的Google+支持在服务器端渲染javascript逻辑,然后再发送预览,但显然这不是对其他类似服务的常见支持,Google.com也支持基于js的单页应用程序的索引编制。)

有更好的解决方案来优雅地解决这个问题,而不是后备有动态页面,其中包括真实的数据?我在理解这个问题时错过了什么?

========

...我甚至想到的是,对于确定为FB请求(如用户代理)的请求,将其重定向到包裹某物像PhantomJS一个特殊的网关,获取页面,渲染服务器端,并发回DOM树快照作为FB的内容以生成预览。但我也怀疑这是一个好方向。 :(

+0

如果您使用节点,我创建了一个模块,可以帮助您在服务器中呈现fb或google阅读的正确页面。 https://www.npmjs.org/package/googlebot –

+0

嗨@dvidsilva,很酷。我会检查出来的,谢谢。 –

+0

Hi @dvidsilva,对于谷歌机器人将作为实际Web应用程序的反向代理工作很好。如果前端Web服务器识别了机器人请求(例如通过useragent检查),请将请求路由到Googlebot,然后从真实应用服务器中抓取实际页面。不确定是否支持:) –

我们的情况是一样的,最简单的解决方案是在你的服务器提供给Facebook刮板的页面中使用Open Graph元标记 基本上你需要在服务器端做你的web应用程序做客户端。侧的工作量在很大程度上取决于你的主机技术(MVC使得它超级简单),你的URI格式和API的使用

你会发现一些说明这里: https://developers.facebook.com/docs/plugins/share-button/

打开图介绍: http://ogp.me/