像时间线页面选项卡中的详细页面

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了像时间线页面选项卡中的详细页面相关的知识,希望对你有一定的参考价值。

我有一个Facebook时间线页面标签应用程序,它在粉丝页面上的IFRAME中运行。

在应用程序的主页面上,我们显示10个作业,用户可以点击进入一本书的详细信息页面。

我们想在这些详细信息页面上添加一个LIKE按钮,以便facebook上的用户可以在他们的流中喜欢并分享该作业。

该应用程序是完全动态的,因此不同的客户可以在其粉丝页面上安装该应用程序并列出自己的工作。 (例如,可口可乐将它安装在他的可口可乐页面上并列出公司内的工作。然后微软也安装它并做同样的事情)

问题涉及og:meta标签和重定向喜欢的详细信息页面链接,正确的facebook公司页面和显示作业的相对右侧详细信息页面。

我可以完成这两件事,但不能同时工作:

A.当我使用类似按钮的以下实现时,Facebook正确获取头部中的og:meta标签,带有图像,标题,描述(没有“data-href”额外属性)

    <div class="fb-like"  
             data-send="false" 
             data-layout="button_count" 
             data-show-faces="false" 
             data-action="like" 
             data-font="arial">
    </div>

问题是没有指定data-href属性(并且og:url meta被完全忽略)这将创建一个指向当前页面=> iframe当前页面的链接=>所以结果将是当你单击Facebook上的共享作业,您将被重定向,而不是在facebook app -right page -right详细信息页面内,而是在托管应用程序的服务器上的详细信息页面中。

B.如果我改为指定data-href属性

   <div class="fb-like"  
             data-href=<%= "http://www.facebook.com/pages/:page/#{session[:fb_page_id]}?v=app_XXXXXXX&app_data=#{@job_details.job_id}" %> 
             data-send="false" 
             data-layout="button_count" 
             data-show-faces="false" 
             data-action="like" 
             data-font="arial">
    </div>

这样做我可以在Facebook上发布正确的链接(然后使用&app_data属性)我可以得到完美的重定向工作。但是在缺点方面,og:metatags完全被忽略,而facebook则选择页面选项卡metatags(托管页面框应用程序的顶级iframe),因此我在facebook上发布了一个废话链接,告诉Facebook页面应用程序的页面图片。更大的缺点是,当你喜欢应用程序上的工作时,所有工作似乎也都很受欢迎(基本上iFrame应用程序成为喜欢的页面......而不是选择作为喜欢页面的工作详细信息页面)

是否有任何天才知道如何解决这个问题?我需要让A和B同时工作以获得所要求的结果!

请帮忙!!! :(

答案

我自己找到了解决方案。

  • 喜欢button =>使用href和ref属性,特别是在你的facebook粉丝页面的id上加上ref。传递当前页面URL也将正确加载和共享og:元标记。 <div class="fb-like" data-send="false" data-show-faces="false" data-layout="button_count" data-font="arial" data-action="recommend" href=<%= "https://app.com/jobs/job_details.job_id" %> ref=<%= FB_PAGE_ID %>> </div>

一旦你将ref属性传递给facebook,你的墙上就会发布一个链接,其中附加了额外的查询字符串,特别是“fb_ref”参数:

例如,带参数的按钮:href = <%=“https://app.com/jobs/job_details.job_id”%>和ref = <%= 332325142248470%>

成为:https://app.com/jobs/a0Ed000000a54bkEAA?fb_ref=332325142248470&fb_source=profile_multiline

  • 当用户点击链接时,我们希望将其重定向到正确的页面选项卡应用程序和正确的作业详细信息页面内。为了实现这一点,我们设置了控制器/ show动作(在ruby corrisponds到controller_name / id)一个新的重定向,记住ref将放在我们的href链接之后的查询字符串中: if params[:fb_ref] redirect_to "http://www.facebook.com/pages/:page/#{params[:fb_ref]}?v=app_xxxxx&app_data=#{params[:id]}" end

如您所见,我们创建了一个新的动态网址,它将使用facebook“signed_riquest”(http://developers.facebook.com/docs/authentication/signed_request/)的“app_data”参数,以便传递给我们的应用程序正确的详细信息页面可视化,并将我们重定向到正确的Facebook页面。

  • 完成此操作后,我们只需正确管理现在使用signed_request的新app_data参数。在我的一个主控制器中,我用过: if fb_signed_request[:app_data] redirect_to "/jobs/#{session[:app_data]}" end

我们将看到我们的应用程序加载正确的页面和正确的工作详细信息页面!

希望能帮到别人!

以上是关于像时间线页面选项卡中的详细页面的主要内容,如果未能解决你的问题,请参考以下文章

Android - 一个选项卡中的多个片段

如何防止在android片段中按下后退按钮时调用onCreateView

我在 viewpager 选项卡中的片段不刷新

带有标签和 Viewpager 的 Android 片段

如何在单击反应中的按钮时在新选项卡中打开页面?我也想向该页面发送一些数据

路由到单独选项卡中的页面时没有后退按钮(单页应用程序)