Facebook Connect Presentation 08 10 2008

  • Published on
    01-Sep-2014

  • View
    2.327

  • Download
    1

DESCRIPTION

An introduction to Facebook Connect, from the London Facebook Developer Garage in October 2008

Transcript

  • An introduction to Facebook Connect London Facebook Developer Garage, October 8 th 2008
  • Facebook Connect - Introduction
    • What Facebook Connect does:
    • Allow social graph (your friend network) information to be brought to external websites
    • Allow external website activity to be brought into Facebook
    • Both aspects are key as to why this is a priority for Facebook.
  • Facebook Connect - Introduction
    • What this looks like:
    Two different methods for login, in this implementation
  • Facebook Connect - Introduction
    • What this looks like:
    A Facebook styled dialogue box lets the user know whats going on
  • Facebook Connect - Introduction
    • What you can do when youre Connected:
    • Display information from Facebook profiles on your own site
    • Publish stories to Facebook from your site
    • Re-create your users social graphs
  • Facebook Connect - Introduction
  • Facebook Connect How it works
    • Quick tech intro:
    • Uses an evolved version of the JavaScript client library:
    • Use FBML within your standard HTML. (They call this XFBML.)
    • Make standard Facebook API calls within the JavaScript library
    • Facebooks JavaScript XFBML library populates FBML tags on your site with profile data
  • Facebook Connect How it works
    • Some Connect code:
    • type="text/javascript">
    This loads in the JavaScript library which renders the login button
  • Facebook Connect How it works
    • Some Connect code:
    • type="text/javascript">
    • FB_RequireFeatures(["XFBML"], function()
    • {
    • });
    Now weve got the library loaded, we need to tell it the features we need. In this case: XFBML covers it. As a parameter to loading the library, we pass a function we want to run once we know its loaded
  • Facebook Connect How it works
    • Some Connect code:
    • type="text/javascript">
    • FB_RequireFeatures(["XFBML"], function()
    • {
    • FB.Facebook.init("1b293e1be6fbff075cd8b9a9372186e9", "/six_degrees/xd_receiver.htm");
    • });
    • });
    We initialise the connection with our applications public API key and a relative path to the cross-domain receiver file (which Facebook provides)
  • Facebook Connect How it works
    • Some Connect code:
    • type="text/javascript">
    • FB_RequireFeatures(["XFBML"], function()
    • {
    • FB.Facebook.init("1b293e1be6fbff075cd8b9a9372186e9", "/six_degrees/xd_receiver.htm");
    • FB.Facebook.get_sessionState().waitUntilReady(function()
    • {
    • });
    • });
    Now we wait for a session using more of Facebooks code, and pass another function that we want to run when its done
  • Facebook Connect How it works
    • Some Connect code:
    • type="text/javascript">
    • FB_RequireFeatures(["XFBML"], function()
    • {
    • FB.Facebook.init("1b293e1be6fbff075cd8b9a9372186e9", "/six_degrees/xd_receiver.htm");
    • FB.Facebook.get_sessionState().waitUntilReady(function()
    • {
    • FB.Facebook.apiClient.friends_get (null, function(result, ex) {
    • window.alert("Friends list: " + result);
    • });
    • });
    • });
    Now everythings loaded, we can get a list of the users friends from the API with a familiar-looking method call.
  • Facebook Connect How it works
    • What you cant do:
    • Publish stories to a friends newsfeed, only to the current users
    • Update any profile box except that of the current user
    • Limited set of FBML tags in XFBML at present
  • Facebook Connect Connecting accounts
    • One more feature:
    • Migrating the social graph from Facebook
    • Works by matching e-mail addresses used on your site with e-mail addresses entered into Facebook
    • Prompt your site users to invite their friends to connect to your site
      • Uses the new fb:connect-form tag
  • Facebook Connect Disadvantages
    • There are disadvantages to Facebook Connect
  • Facebook Connect Disadvantages
    • Its all in JavaScript:
    • Not always the most manageable code
    • Takes some lateral thinking to hook up with your sites databases
    • No SEO benefits
    • Poor accessibility (JavaScript disabled = Facebook Connect doesnt work)
  • Facebook Connect Disadvantages
    • Its not a treasure-trove of new user details:
    • Cant access any more friend details than if a user adds an application i.e. no access to e-mail addresses
    • Facebook intends privacy settings to be dynamic, therefore changes in Facebook settings may affect your site
    • You dont own the data
  • Facebook Connect The future
    • Due to be launched to everyone soon
    • Going to be a big focus for Facebook
      • Facebooks move to be at the centre of social activity
    • May see Connect stories being given greater priority in the newsfeed
    • Expect Connect plug-ins for blogs, Digg, and every web 2.0 type site there is
    See current Facebook Connect implementations at: http://www.somethingtoputhere.com/therunaround http://www.theinsider.com/
  • Facebook Connect The future
    • Thanks
    Karl Bunyan, karl.bunyan@exponetic.com