Question

我正在尝试创建一个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;
}

Answer 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'});

Answer 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>

Answer 3

如果你有这个文件xd_receiver.html，请确保使用你网站的完整网址正确指定xd_receiver.html文件的路径，如下所示：

http://www.yoursite.com/xd_receiver.html

Answer 4

我发现如果你在request-form元素中指定了target =“_ self”（不是在友情选择器中，如Domenic建议的那样），则响应url将加载到iframe中，而不是重新加载整个页面。

因此，您可以在此时加载自己的提示来关闭窗口，或者通过更多工作向父级发送消息以自动关闭整个iframe。

Answer 5

您能解释一下您的应用的更多信息吗？是Flash吗？您在服务器端使用什么类型的技术。如果您有PHP，可以使用Jquery灯箱或smoothbox弹出邀请页面。我使用FBML代码邀请我的应用程序甚至认为我的应用程序的其余部分是使用Facebook API而不是FBML。这里有一个例子，如果你有PHP，如果你没有，你仍然可以使用它，如果你有这样的问题，请告诉我：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <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 http://developers.facebook.com $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=\"http://apps.facebook.com/".$app_url."/\">".$app_name."</a></b>.<br><br>\n"; echo "<h2><a href=\"http://apps.facebook.com/".$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=\"http://apps.facebook.com/".$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连接显示邀请朋友对话框并在完成时关闭

5 个答案: