Facebook 连接显示邀请朋友对话框并在完成时关闭
Posted
技术标签:
【中文标题】Facebook 连接显示邀请朋友对话框并在完成时关闭【英文标题】:Facebook connect displaying invite friends dialog and closing on completion 【发布时间】:2009-11-23 09:20:01 【问题描述】:我正在尝试创建一个 Facebook Connect 应用程序,该应用程序使用 Facebook 的 javascript API(通过 FBMLPopupDialog)在页面内显示朋友邀请对话框。
问题是显示一个朋友邀请对话框,您使用 多朋友表单,该表单需要一个 action="url" 属性,该属性表示当用户完成或跳过表单时将您的页面重定向到的 URL。问题是我只想关闭 FBMLPopupDialog (与用户刚刚点击弹出对话框上的“X”按钮的行为相同)。我能做的最好的就是将用户重定向回他们所在的页面,基本上是重新加载,但他们会丢失所有 AJAX/Flash 应用程序状态。
我想知道是否有任何 Facebook Connect 开发人员遇到了这个问题,并且有一个好方法可以在他们的网站中简单地显示一个朋友邀请“灯箱”对话框,他们不想在何时“刷新”或“重定向”用户完成。
facebook connect JS API 提供了一个FB.Connect.inviteConnectUsers,它提供了一个不错的对话框,但只连接您的应用程序的现有用户,这些用户也有一个 Facebook 帐户但尚未连接。
http://bugs.developers.facebook.com/show_bug.cgi?id=4916
function fb_inviteFriends()
//Invite users
log("Inviting users...");
FB.Connect.requireSession(
function() //Connect succes
var uid = FB.Facebook.apiClient.get_session().uid;
log('FB CONNECT SUCCESS: ' + uid);
//Invite users
log("Inviting users...");
//Update server with connected account
updateAccountFacebookUID();
var fbml = fb_getInviteFBML() ;
var dialog = new FB.UI. FBMLPopupDialog("Weblings Invite", fbml) ;
//dialog.setFBMLContent(fbml);
dialog.setContentWidth(650);
dialog.setContentHeight(450);
dialog.show();
,
//Connect cancelled
function()
//User cancelled the connect
log("FB Connect cancelled:");
);
function fb_getInviteFBML()
var uid = FB.Facebook.apiClient.get_session().uid;
var fbml = "";
fbml =
'<fb:fbml>\n' +
'<fb:request-form\n'+
//Redirect back to this page
' action="'+ document.location +'"\n'+
' method="POST"\n'+
' invite="true"\n'+
' type="Weblings Invite"\n' +
' content="I need your help to discover all the Weblings and save the Internet! WebWars: Weblings is a cool new game where we can collect fantastic creatures while surfing our favorite websites. Come find the missing Weblings with me!'+
//Callback the server with the appropriate Webwars Account URL
' <fb:req-choice url=\''+ WebwarsFB.WebwarsAccountServer +'/SplashPage.aspx?action=ref&reftype=Facebook' label=\'Check out WebWars: Weblings\' />"\n'+
'>\n'+
' <fb:multi-friend-selector\n'+
' rows="2"\n'+
' cols="4"\n'+
' bypass="Cancel"\n'+
' showborder="false"\n'+
' actiontext="Use this form to invite your friends to connect with WebWars: Weblings."/>\n'+
' </fb:request-form>'+
' </fb:fbml>';
return fbml;
【问题讨论】:
【参考方案1】:如果有人会在 2011 年寻找这样的东西,这里是链接:http://developers.facebook.com/docs/reference/dialogs/requests/,您需要发送应用程序请求的代码是:
FB.ui(method: 'apprequests', message: 'A request especially for one person.', data: 'tracking information for the user');
【讨论】:
【参考方案2】:我就是这样解决的
我的 JS/FBML(注意多朋友选择器的 target="_self"
属性):
var inviteDialog; // Keep a reference for the popup dialog
function makeInviteForm()
// Set up request form elements here
var fbml = '';
fbml += '<fb:fbml>';
fbml += ' <fb:request-form type="' + requestType + '" content="' + requestContent + '" action="' + actionUrl + '" method="post" >';
fbml += ' <fb:multi-friend-selector target="_self" exclude_ids="" max=' + maxFriends + ' cols="4" rows="3" showborder="false" actiontext="Invite friends!" />';
fbml += ' </fb:request-form>';
fbml += '</fb:fbml>';
inviteDialog = new FB.UI.FBMLPopupDialog(title, fbml);
我的 php:
<?php
// Do processing here
?>
<script type="text/javascript">
parent.inviteDialog.close(); // You could make this call a function that does additional processing if you want
</script>
【讨论】:
【参考方案3】:如果您在某处有此文件 xd_receiver.html,请确保使用您网站的完整 url 正确指定 xd_receiver.html 文件的路径,如下所示:
http://www.yoursite.com/xd_receiver.html
【讨论】:
邀请表单显示正确,我很确定我的 xd_receiver 设置正确。这只是跳过或完成时邀请表单的行为导致整个页面刷新而不是关闭 FBMLPopupDialog。 我遇到了类似的问题,我所做的是将 xd_receiver.html 文件放在站点的根目录下,问题得到解决,即对话框正确关闭【参考方案4】:我发现如果你在 request-form 元素中指定 target="_self" (而不是在朋友选择器中,正如 Domenic 建议的那样),响应 url 将在 iframe 中加载,而不是重新加载整个页面。
因此,您可以在此时加载自己的提示来关闭窗口,或者通过更多工作向父级发送消息以自动关闭整个 iframe。
【讨论】:
【参考方案5】:您能否详细介绍一下您的应用。是闪存吗?您在服务器端使用什么类型的技术。如果你有 PHP,你可以使用 Jquery lightbox 或 smoothbox 来弹出邀请页面。我使用 FBML 代码来邀请我的应用程序,即使我的应用程序的其余部分是使用 Facebook API 而不是 FBML。以下是您是否有 PHP 的示例,如果没有,如果您遇到问题,您仍然可以使用它,请告诉我:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "@987654321@">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml">
<head>
<script type="text/javascript" src="...
.... Your stuf here
.... title="stylesheet" type="text/css">
</head>
<body>
<script src="http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php" type="text/javascript"></script>
<? include "my header file was here!"; ?>
<?PHP // Get these from @987654322@
$api_key = '[api_key]'; $secret = '[secret]';
$app_name = "[Your App name]";
$app_url = "[your canvas page]";
$invite_href = "[put_destination]"; // Rename this as needed
require_once '../neo_nosrati/facebook-platform/facebook.php';
/*change accordingly probably something like:../facebook/facebook-platform/php/facebook.php' . THE API Library you downloaded from facebook! */
$facebook = new Facebook($api_key, $secret); $facebook->require_frame();
$user = $facebook->require_login(); if(isset($_POST["ids"])) echo "<center>Thank you for inviting ".sizeof($_POST["ids"])." of your friends on <b><a href=\"@987654323@".$app_url."/\">".$app_name."</a></b>.<br><br>\n"; echo "<h2><a href=\"@987654324@".$app_url."/\">Click here to return to ".$app_name."</a>.</h2></center>";
else // Retrieve array of friends who've already authorized the app.
$fql = 'SELECT uid FROM user WHERE uid IN (SELECT uid2 FROM friend WHERE uid1='.$user.') AND is_app_user = 1'; $_friends = $facebook->api_client->fql_query($fql); // Extract the user ID's returned in the FQL request into a new array.
$friends = array();
if (is_array($_friends) && count($_friends)) foreach ($_friends as $friend) $friends[] = $friend['uid'];
// Convert the array of friends into a comma-delimeted string.
$friends = implode(',', $friends); // Prepare the invitation text that all invited users will receive.
$content = "<fb:name uid=\"".$user."\" firstnameonly=\"true\" shownetwork=\"false\"/> has started using <a href=\"@987654325@".$app_url."/\">".$app_name."</a>. YOUR MESSAGE. You should definitely try it out!\n". "<fb:req-choice url=\"".$facebook->get_add_url()."\" label=\"Somthing like. Add app!\"/>";
?>
<fb:serverfbml style="width: 750px;"> <script type="text/fbml"> <fb:fbml>
<fb:request-form action="<? echo $invite_href; ?>" method="post" type="<? echo $app_name; ?>" content="<? echo htmlentities($content,ENT_COMPAT,'UTF-8'); ?>"> <fb:multi-friend-selector actiontext="Here are your friends who have not added the application yet." exclude_ids="<? echo $friends; ?>" /> </fb:request-form>
</fb:fbml> </script> </fb:serverfbml>
<?PHP ?>
<script type="text/javascript"> FB_RequireFeatures(["XFBML"], function() FB.Facebook.init("Secret Api", "../xd_receiver.htm"); ); </script>
</body>
</html>
【讨论】:
以上是关于Facebook 连接显示邀请朋友对话框并在完成时关闭的主要内容,如果未能解决你的问题,请参考以下文章
邀请 Facebook 朋友加入我的 iOS 应用程序,该应用程序不是具有自定义 UI 的游戏
在 android 上使用新的 API 2.0 管理 facebook 邀请