Facebook + Ruby

+ Building Facebook Applications with Ruby Alex Koppel, 12/2010

WHY DEVELOP WITH FACEBOOK? Over 500 million users 50% of active users log on every day 150 million in USA 10 million in Germany Application Platform Over 550,000 applications Over 1,000,000 websites integrated with Facebook Over 150 million users use such FB integrations / month Huge audience, extensive Platform

WHAT CAN APPS OFFER USERS? Better interface to Facebook core functionality iPhoto, Wall moderation and publishing platforms Promotion of an existing service Netflix, Yelp, Goodreads Create a connection with fans of a brand Chase Community Giving, other branded apps Authentication Groupon, Kayak, Goodreads Many applications fall into multiple categories

WHAT KINDS OF APPS ARE THERE? Websites Your own site Complete control Javascript SDK Any level of integration Canvas Apps Tab Apps Mobile Apps Desktop Apps Hosted on facebook.com Less friction for users on the site Some limitations (size/etc.) FBML+FBJS => restrictions

WEBSITES Wherever, whatever Benefits for users A way to share activity Easy login Lightweight integration Social plugins (iframes) Javascript SDK only Heavyweight integration Javascript frontend Server backend

CANVAS APPS Live on Facebook iframe or FBML iframe ~ website FBML to be retired Less friction than off-FB apps Users stay on site Have to work within Facebook limits iframe container Fixed size

TAB APPS Live on Facebook Page Tight integration with Page (brand/product) Can help drive Liking Limitations FBML/FBJS only (iframe in the future) Size limitation First load is anonymous

FACEBOOK INTEGRATION Both front- and back-end integration Browser handles tasks requiring interaction Login, permissions, publishing stories Server handles many API-related tasks Offline access, realtime updates, app management Persisting results Many tasks can be done by either server or client Authentication API calls Let your need guide you

FACEBOOK AUTHENTICATION OAuth-based authentication scheme Token provides access to user info Multiple ways to authenticate Javascript API Redirect with OAuth code Signed request parameters Provided in request to tab and canvas apps Old proprietary auth scheme being deprecated

AUTHENTICATING WITH JAVASCRIPT iframe-based secure login prompt XFBML login button Programatic via Javascript Includes permissions if desired Browser gets OAuth token, user ID, expiration, etc. Notified through callback and event Javascript sets signed cookie cookies Server libraries provided parsing Preferred method Easy for users Keeps people on your site

AUTHENTICATING WITH REDIRECTS Send user to login page on facebook.com User redirected to app’s callback with OAuth code App server requests token using code and secret Server gets OAuth token and expiration Can then make server-side API calls Use the JS login if you can Redirects are disruptive Requires server-server communication

PERMISSIONS Granular permission model 55 different controls over data access User data Feed, likes, checkins Demographic data, email Friends’ data Friends’ demographics, likes, checkins, etc. Cannot get friends of friends Acting for user Publish to feed stories

FACEBOOK APIS Facebook has 2.5 server-side APIs All RESTful with JSON responses Graph API New, fast, shiny, incomplete OAuth authentication Accessible via the browser REST API Supports almost the entire API To be deprecated, someday Fast new OAuth endpoint Slow old custom auth endpoint

API METHODS REST API method names Many but not all also available via Graph API events.invite pages.blockFan fql.query photos.upload, videos.upload ads.createCampaigns status.set admin.setAppProperties Graph API only: https://graph.facebook.com/user_id/checkins https://graph.facebook.com/app_id/insights

MAKING IT WORK WITH RUBY Many Facebook libraries for new Graph/REST APIs Koala Mogli MiniFB rest-graph FBGraph For old REST API/custom auth, one clear winner Facebooker

KOALA My goals: lightweight, fast, flexible, tested All results as basic Ruby objects (Hash, Array)* Full support for Facebook platform OAuth, Graph, REST, realtime updates, test users Typhoeus and Net::HTTP built in Full RSpec coverage Rails 3- and Ruby 1.9.2-compatible * get_connection and search return GraphCollection < Array, which provides pagination support

AUTHENTICATION WITH COOKIES @oauth = Koala::Facebook::OAuth.new(app_id, secret, callback_url) # pass in Rack cookies directly @oauth.get_user_from_cookies(cookies) # => "2905623" @oauth.get_user_info_from_cookies(cookies) # => { "session_key"=> ..., "uid"=>"2905623" , "sig"=> ..., "secret"=>"YeOkUZhI6csLggJ_jFmm2A__", "access_token" => ... }

AUTHENTICATION WITH REDIRECTS @oauth = Koala::Facebook::OAuth.new(app_id, secret, callback_url) @oauth.url_for_oauth_code(:permissions => "publish_stream") # => url # send your users there, they’ll return with their codes @oauth.get_access_token(code) # => token @oauth.get_access_token_info(code) # => { "expires" => seconds_from_now, "access_token" => ... }

USING THE GRAPH API @graph = Koala::Facebook::GraphAPI.new(oauth_token) @graph.get_object("koppel") # => { " name "=>"Alex Koppel", " timezone "=>1, " gender "=>"male", " id "=>"2905623", " first_name "=>"Alex", " last_name "=>"Koppel", " updated_time "=>"2009-10-25T21:27:40+0000", " verified "=>true, " locale "=>"de_DE", " link "=>"http://www.facebook.com/koppel" }

USING THE GRAPH API @graph.get_connections("koppel", "feed") # => [{ # lots of data! " id "=>"2905623_174424332576660", " message "=>"At Can-Tine drinking beer, eating spicy poutine, and watching Army of Darkness.", " likes "=>2, " comments "=>{"data"=>[{"from"=>{"name"=>"Isaac Wolkerstorfer", "id"=>"2900100"}, "id"=>"2905623_174424332576660_2109285", "created_time"=>"2010-12-01T20:31:44+0000", "message"=>"This place sounds amazing."}], "count"=>1} " from "=>{"name"=>"Alex Koppel", "id"=>"2905623"}, " created_time "=>"2010-12-01T18:05:09+0000", " type "=>"status", “ privacy "=>{"value"=>"NETWORKS_FRIENDS"}, " attribution "=>"iPhone", " actions "=>[{"name"=>"Comment", "link"=>...}, ...], }, ...]

USING THE GRAPH API @graph.search("Muenchen") # => [{ # lots of data! {" from "=>{"name"=>"Daniel Ragogna", "id"=>"100000110972279"}, " type " => "status", " message "=>"Muenchen + Dom Rep. Wir kommen Juhu", " id "=>"100000110972279_160648203978214"}, {" from "=>{"name"=>"Scheinen Saint Jesus Jong", "id"=>"561597582"}, " type " => "status", " message "=>"muenchen i m comming", "id " =>"561597582_171405789546392"}, {" name "=>"Main Concept - Muenchen 58", " from "=>{"name"=>"Sergej Galkin", "id"=>"100001607331988"}, " id "=>"100001607331988_154183774628283", " type "=>"video", " source "=>"http://www.youtube.com/v/tyXYK-CgBQo&autoplay=1", " message "=>"...das Spiel Das Ich Treib..."}, ...]

USING THE GRAPH API @graph.put_wall_post(" hey, i'm learning koala ") # => {"id"=> new_post_id) @graph.put_comment(new_post_id, comment_text) # => {"id"=> new_comment_id} @graph.delete_object(new_comment_id) # => true

INTEGRATING KOALA Easy to integrate Koala into Rails Create a before_filter for OAuth validation GraphCollections provide pagination params for urls Documentation on github wiki Can also integrate into authentication middleware Devise, OmniAuth, etc.

JAVASCRIPT SDK (FORMERLY FACEBOOK CONNECT)

JAVASCRIPT SDK OVERVIEW Evented Javascript library for Facebook interaction Login and permission management Cookie session storage XFBML Like and login/logout buttons, profile pics and names Asynchronous API access Avoid server load/delays when generating your UI

JAVASCRIPT SDK EXAMPLES Login with permissions FB.login(callback, {perms: permList}) FB.Event.subscribe("auth.statusChange", callback); function callback(response) { if (response.session) { // user successfully logged in } else { // user cancelled login } }; XFBML login button: <fb:login-button perms=“read_stream"></fb:login-button>

JAVASCRIPT SDK EXAMPLES Is the user a fan of your Page? FB.api({method: "pages.isFan”, page_id: pid}, callback); // can show/hide UI elements based on the result Friend list FB.api({method: ”friends.get”}, callback); // build the UI based on the response

RESOURCES Facebook Developer Wiki Graph API Javascript SDK REST API Facebook Developer Policies Facebook’s Best Practices Facebook’s Bugzilla Koala Facebook library OAuth Playground

ME http://facebook.com/koppel https://graph.facebook.com/koppel http://twitter.com/arsduo http://github.com/arsduo http://blog.twoalex.com

APPENDIX: GRAPH API IN THE BROWSER! You can play with the Graph API in any browser https://graph.facebook.com/ID/CONNECTION_TYPE https://graph.facebook.com/koppel https://graph.facebook.com/contextoptional/feed Private info requires access_token parameter Returns JSON to your browser Go to http://graph.facebook.com/ to authenticate Links with your OAuth token are halfway down Introduction Add metadata=1 to object URLs to see available options Great way to explore the graph

APPENDIX: PUT_WALL_POST In general, don’t post stories via the API Policy limits what you can post automatically Can’t include user message Browser prompt is a much better experience API use appropriate for offline/mobile experiences

Facebook + Ruby

Related slideshows

More Related Content

Facebook + Ruby