Can I use Facebook's fb:friend-selector in an iframe?

Question

I'm trying to use facebook's fb:friend-selector fbml tag, but my application is running in an iframe. Is it possible to use this tag in an iframe, if so anyone have any examples?

Answer 1

Yes, this is definitely possible, but you have to use Facebook Connect and XFBML. Specifically, you want to use the fb:serverfbml tag to get fb:friend-selector working. I have an iframe app whereby I use all of this and the fb:friend-selector in the standard "invite friends to your app" context, and it works great.

Here is the body of my template file, which gets output inside the body of my iframe:

<fb:serverfbml style="width: 650px;"> 
<script type="text/fbml">
    <fb:fbml> 
     <fb:request-form
      action="http://your-site.com/invite/sent"
      method="POST"
      invite="true"
      type="My App"
      content="Try out my app!
       <fb:req-choice url='http://your-facebook-canvas-url'
       label='<?php echo htmlspecialchars("Accept button text",ENT_QUOTES); ?>'
       /> 
      " > 
      <fb:multi-friend-selector
       showborder="false"
       actiontext="Invite your friends to try My App."
       exclude_ids="<?php echo $excludeIds; ?>"
       rows="3"
      /> 
     </fb:request-form> 
    </fb:fbml>
</script> 
</fb:serverfbml>

In the footer of the page, I have the standard Facebook Connect code, which will load and render the fb:serverfbml contents:

<script src="http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php" type="text/javascript"></script>
<script type="text/javascript">
    FB_RequireFeatures(
     ["CanvasUtil"],
     function(){
       FB.XdComm.Server.init('/xd_receiver.html');
       FB.CanvasClient.startTimerToSizeToContent();
     }
    );
</script>

<script type="text/javascript">
    FB_RequireFeatures(["XFBML"], function(){ FB.Facebook.init("Your Facebook API Key", "/xd_receiver.html"); }); 
</script>

That should be all you need (fill in your own options where applicable, of course). You'll have to set up Facebook Connect to work with a cross-domain receiver file. I suggest following the rendering XFBML steps.

Answer 2

Since that are a lot of questions about the friend-selector within an iframe.

Guys the correct sintax now is <fb:serverfbml width="650px">

Answer 3

i have maked all you said and i get the rest but whene i pushed cancel or the invitations are sent it shows me anther facebook in my canvas

Answer 4

I've set up Facebook Connect with a xd_receiver but it displays nothing.

Answer 5

yes this example, including the linked to example, does not work hit cancel o nthe friend sign up and you get a page within a page that says not found