ApiFacebook development<br />by Wang Tao at Ethos  / 2011-2-17<br />
About me<br />@anytao in twitter<br />A .net geek in China<br />
Facebook & its API<br />overview<br />graph Api<br />FQL<br />authentication<br />current solution<br />Other Social Netwo...
Overview<br />Plugin<br />FBML<br />FB App<br />SDK<br />Testing<br />
Restful API<br />
Restful Api<br />https://api.facebook.com/method/[name]<br />users.hasAppPermission<br />users.isAppUser<br />users.getLog...
Graph API<br />Simple, Consistent, and Connected<br />
Objects<br />
Object<br />user<br />page<br />message<br />status message<br />photo<br />video<br />http://graph.facebook.com/anytao<br...
Simple<br />https://graph.facebook.com/{ID}<br />Me<br />https://graph.facebook.com/me/friends<br />
Data object as URL!<br />Consistent<br />All objects in Facebook can be accessed in the same way:<br />Users: https://grap...
Connected<br />user@connections<br /><ul><li>home
feed
posts
friends
picture
photos
…</li></ul>Objects<br />+<br />connections<br />http://graph.facebook.com/anytao/picture<br />http://graph.facebook.com/me...
Json return<br />{<br />   "data": [<br />      {<br />         "id": "555020699_160639637289676",<br />         "message"...
Demo<br />Every object in the social graph has a unique ID. You can access the properties of an object by requesting.<br /...
FQL<br />
Key advantages<br />Common syntax for all methods<br />Condense Facebook queries<br />Reduce response size<br />
FQL is an SQL-like syntax<br />SELECT name FROM user WHERE uid = 4<br />Has AND, OR and NOT keywords<br />Use basic boolea...
FQL is an SQL-like syntax<br />substr()<br />strpos()<br />Example, SELECT location FROM event WHRERE eid=1234567 AND strp...
FQL: Advanced Query<br />SELECT eid FROM event WHERE eid<br />	IN (<br />	SELECT eid FROM event_member WHERE uid = 4<br />...
FQL, not SQL<br />No JOIN<br />No ORDER BY<br />No GROUP BY<br />No LIMIT<br />Only one table in FROM<br />Not allowed: SE...
FQL, not SQL<br />display most recently updated events in Bejing<br />SQL: SELECT * FROM event WHERE location = “bejing” A...
Demo<br />https://api.facebook.com/method/fql.query?access_token=2227470867|2.9stmGn8B630JCOkK7xICMw__.3600.1297922400-738...
Authentication<br />
Facebook Authentication<br />oauth 2.0<br />http://graph.facebook.com/anytao<br />http://graph.facebook.com/anytao/picture...
What is OAuth?<br />
Actors on Facebook oAuth<br />Jacky - User<br />Explorer - Consumer<br />Facebook - Service Provider<br />1<br />2<br />3<...
Retrieve a request token<br />1<br />2<br />3<br />Request user authorization<br />Exchange request token for an access to...
Facebook Authentication / Server side flow<br />Explorer try to access FB<br />OAuth Dialog<br />(App Authorization)<br />...
Facebook Authentication / Server side flow<br />Explorer try to access FB<br />OAuth Dialog<br />(App Authorization)<br />...
Facebook Authentication / Server side flow<br />Explorer try to access FB<br />OAuth Dialog<br />(App Authorization)<br />...
Facebook Authentication / Server side flow<br />Explorer try to access FB<br />OAuth Dialog<br />(App Authorization)<br />...
Facebook Authentication / Server side flow<br />Explorer try to access FB<br />OAuth Dialog<br />(App Authorization)<br />...
Facebook Authentication / Server side flow<br />Explorer try to access FB<br />OAuth Dialog<br />(App Authorization)<br />...
Facebook Authentication / Server side flow<br />http://mydomain.com<br />OAuth<br />(App authorization)<br />Request: http...
Facebook Authentication / Server side flow<br />http://mydomain.com<br />Http 400<br />Failed!<br />{ "error": { "type": "...
Facebook Authentication / Server side flow<br />http://mydomain.com<br />HTTP 302<br />(redirect_url)<br />Successful auth...
Facebook Authentication / Client side flow<br />Http request<br />HTTP 302<br />(redirect_url)<br />Pass URI fragment with...
Upcoming SlideShare
Loading in...5
×

Facebook and its development

12,173

Published on

The facebook development releated knowledge, Graph API, Authenitication, and FQL.

Published in: Technology
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
12,173
On Slideshare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
0
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide
  • arsort($result);array_slice($result, 0, 5);
  • Transcript of "Facebook and its development"

    1. 1. ApiFacebook development<br />by Wang Tao at Ethos / 2011-2-17<br />
    2. 2. About me<br />@anytao in twitter<br />A .net geek in China<br />
    3. 3. Facebook & its API<br />overview<br />graph Api<br />FQL<br />authentication<br />current solution<br />Other Social Network: Twitter, t.sina<br />
    4. 4. Overview<br />Plugin<br />FBML<br />FB App<br />SDK<br />Testing<br />
    5. 5. Restful API<br />
    6. 6. Restful Api<br />https://api.facebook.com/method/[name]<br />users.hasAppPermission<br />users.isAppUser<br />users.getLoggedInUser<br />Benefit<br />Easy SOA<br />Resource<br />Only Http<br />Stateless<br />Light Weight<br />Simple<br />Readable<br />Json and XML<br />deprecated<br />https://api.facebook.com/method/users.getInfo?uids=555020699&fields=name&access_token=…<br />
    7. 7. Graph API<br />Simple, Consistent, and Connected<br />
    8. 8. Objects<br />
    9. 9. Object<br />user<br />page<br />message<br />status message<br />photo<br />video<br />http://graph.facebook.com/anytao<br />http://graph.facebook.com/platform<br />https://graph.facebook.com/{ID}<br />
    10. 10. Simple<br />https://graph.facebook.com/{ID}<br />Me<br />https://graph.facebook.com/me/friends<br />
    11. 11. Data object as URL!<br />Consistent<br />All objects in Facebook can be accessed in the same way:<br />Users: https://graph.facebook.com/btaylor (Bret Taylor)<br />Pages: https://graph.facebook.com/cocacola (Coca-Cola page)<br />Events: https://graph.facebook.com/251906384206 (Facebook Developer Garage Austin)<br />Groups: https://graph.facebook.com/195466193802264 (Facebook Developers group)<br />Applications: https://graph.facebook.com/2439131959 (the Graffiti app)<br />Status messages: https://graph.facebook.com/367501354973 (A status message from Bret)<br />Photos: https://graph.facebook.com/98423808305 (A photo from the Coca-Cola page)<br />Photo albums: https://graph.facebook.com/99394368305 (Coca-Cola's wall photos)<br />Profile pictures: http://graph.facebook.com/anytao/picture (your profile picture)<br />Videos: https://graph.facebook.com/614004947048 (A Facebook tech talk on Tornado)<br />Notes: https://graph.facebook.com/122788341354 (Note announcing Facebook for iPhone 3.0)<br />Checkins: https://graph.facebook.com/414866888308 (Check-in at a pizzeria)<br />
    12. 12. Connected<br />user@connections<br /><ul><li>home
    13. 13. feed
    14. 14. posts
    15. 15. friends
    16. 16. picture
    17. 17. photos
    18. 18. …</li></ul>Objects<br />+<br />connections<br />http://graph.facebook.com/anytao/picture<br />http://graph.facebook.com/me/friends<br />
    19. 19. Json return<br />{<br /> "data": [<br /> {<br /> "id": "555020699_160639637289676",<br /> "message": "I agree with Reg, this makes me really proud to live in Toronto...",<br />"picture": "http://external.ak.fbcdn.net/safe_image.php?d=ace00444e7daf6cb40d8605fae85c257&w=130&h=130&url=http%3A%2F%2Fi.ytimg.com%2Fvi%2F-KGLgDQAo5U%2F0.jpg",<br /> "link": "http://www.youtube.com/watch?v=-KGLgDQAo5U&feature=youtube_gdata_player",<br /> "source": "http://www.youtube.com/v/-KGLgDQAo5U&autoplay=1",<br /> "name": "Hoedown Throwdown",<br /> "caption": "www.youtube.com",<br /> "description": "I got off the subway at Bloor and Yonge last night, and this is what I saw; some buskers with a fiddle and a banjo were playing, and these four other guys just started to pop it and lock it, apparently just for the hell of it. It cheered me right up.",<br /> "icon": "http://static.ak.fbcdn.net/rsrc.php/zj/r/v2OnaTyTQZE.gif",<br /> "actions": [<br /> {<br /> "name": "Comment",<br /> "link": "http://www.facebook.com/555020699/posts/160639637289676"<br /> },<br /> {<br /> "name": "Like",<br /> "link": "http://www.facebook.com/555020699/posts/160639637289676"<br /> }<br />], <br />
    20. 20. Demo<br />Every object in the social graph has a unique ID. You can access the properties of an object by requesting.<br />https://graph.facebook.com/{ID}<br />http://graph.facebook.com/anytao<br />http://graph.facebook.com/anytao<br />https://graph.facebook.com/anytao/friends?access_token=2227470867|2.0x1QCxus6HCsWaaMArPglg__.3600.1297929600-738694610|aZXed9W0Ank-2mhI73UnwIX3gYI<br />https://graph.facebook.com/anytao/friends?access_token=2227470867|2.0x1QCxus6HCsWaaMArPglg__.3600.1297929600-738694610|aZXed9W0Ank-2mhI73UnwIX3gYI<br />
    21. 21. FQL<br />
    22. 22. Key advantages<br />Common syntax for all methods<br />Condense Facebook queries<br />Reduce response size<br />
    23. 23. FQL is an SQL-like syntax<br />SELECT name FROM user WHERE uid = 4<br />Has AND, OR and NOT keywords<br />Use basic boolean operators<br />SELECT uid2 FROM friend WHERE uid = 4 AND uid2 > (4 + 1000)<br />Enhance queries with basic functions<br />now()<br />strlen()<br />
    24. 24. FQL is an SQL-like syntax<br />substr()<br />strpos()<br />Example, SELECT location FROM event WHRERE eid=1234567 AND strpos(name, “facebook”) AND start_time > 10000000<br />
    25. 25. FQL: Advanced Query<br />SELECT eid FROM event WHERE eid<br /> IN (<br /> SELECT eid FROM event_member WHERE uid = 4<br />) AND location = “beijing”<br />
    26. 26. FQL, not SQL<br />No JOIN<br />No ORDER BY<br />No GROUP BY<br />No LIMIT<br />Only one table in FROM<br />Not allowed: SELECT * FROM user, photo WHERE uid = 4<br />
    27. 27. FQL, not SQL<br />display most recently updated events in Bejing<br />SQL: SELECT * FROM event WHERE location = “bejing” AND user = 4 ORDER BY update_time ASC<br />FQL:<br />SELCT update_time, eid, name, location FROM event WHERE eid IN (SLECT eid FROM event_member WHERE uid = 4) AND location = “beijing”<br />
    28. 28. Demo<br />https://api.facebook.com/method/fql.query?access_token=2227470867|2.9stmGn8B630JCOkK7xICMw__.3600.1297922400-738694610|gdYJgGegkPa71WVFv-HD2XMxi0M&format=json&query=select%20name%20from%20user%20where%20uid=621627426<br />https://api.facebook.com/method/fql.query?access_token=2227470867|2.gouA9cuplsTSEpAOnMBlhA__.3600.1298304000-738694610|allgk00e3d6e6S33DzFi8-kteQ0&format=json&query=select%20name,%20location%20from%20event%20where%20eid%20in%20(select%20eid%20from%20event_member%20where%20uid%20=%20738694610)<br />select name, location from event where eid in (select eid from event_member where uid = 738694610)<br />
    29. 29. Authentication<br />
    30. 30. Facebook Authentication<br />oauth 2.0<br />http://graph.facebook.com/anytao<br />http://graph.facebook.com/anytao/picture<br /><public data><br />http://graph.facebook.com/anytao/home?access_token=<br />http://graph.facebook.com/anytao/feed?access_token=<br />access_token<br /><privatec data><br />
    31. 31. What is OAuth?<br />
    32. 32. Actors on Facebook oAuth<br />Jacky - User<br />Explorer - Consumer<br />Facebook - Service Provider<br />1<br />2<br />3<br />Example<br />
    33. 33. Retrieve a request token<br />1<br />2<br />3<br />Request user authorization<br />Exchange request token for an access token<br />Example<br />
    34. 34. Facebook Authentication / Server side flow<br />Explorer try to access FB<br />OAuth Dialog<br />(App Authorization)<br />OAuth Dialog<br />(User Authentication)<br />https://www.facebook.com/dialog/oauth?     client_id=YOUR_APP_ID&redirect_uri=YOUR_URL<br />
    35. 35. Facebook Authentication / Server side flow<br />Explorer try to access FB<br />OAuth Dialog<br />(App Authorization)<br />OAuth Dialog<br />(User Authentication)<br />https://www.facebook.com/dialog/oauth?     client_id=YOUR_APP_ID&redirect_uri=YOUR_URL&scope=email,read_stream<br />
    36. 36. Facebook Authentication / Server side flow<br />Explorer try to access FB<br />OAuth Dialog<br />(App Authorization)<br />OAuth Dialog<br />(User Authentication)<br />Cookie not found, show OAuthDialog(facebook layout)<br />
    37. 37. Facebook Authentication / Server side flow<br />Explorer try to access FB<br />OAuth Dialog<br />(App Authorization)<br />OAuth Dialog<br />(User Authentication)<br />Goes to App Authorization directly…<br />
    38. 38. Facebook Authentication / Server side flow<br />Explorer try to access FB<br />OAuth Dialog<br />(App Authorization)<br />Http 302<br />(redirect_urlparam)<br />OAuth Dialog<br />(User Authentication)<br />Don’t allow!<br />http://YOUR_URL?error_reason=user_denied&     error=access_denied&error_description=The+user+denied+your+request.<br />
    39. 39. Facebook Authentication / Server side flow<br />Explorer try to access FB<br />OAuth Dialog<br />(App Authorization)<br />Http 302<br />(redirect_urlparam)<br />OAuth Dialog<br />(User Authentication)<br />Allow! Redirect with Authorization Code param<br />http://YOUR_URL?code=A_CODE_GENERATED_BY_SERVER<br />
    40. 40. Facebook Authentication / Server side flow<br />http://mydomain.com<br />OAuth<br />(App authorization)<br />Request: https://graph.facebook.com/oauth/access_token<br />https://graph.facebook.com/oauth/access_token?     client_id=YOUR_APP_ID&redirect_uri=YOUR_URL&     client_secret=YOUR_APP_SECRET&code=THE_CODE_FROM_ABOVE<br />
    41. 41. Facebook Authentication / Server side flow<br />http://mydomain.com<br />Http 400<br />Failed!<br />{ "error": { "type": "OAuthException", "message": "Error validating verification code." } }<br />
    42. 42. Facebook Authentication / Server side flow<br />http://mydomain.com<br />HTTP 302<br />(redirect_url)<br />Successful authenticated!<br />access_tokenin the body of the request<br />
    43. 43. Facebook Authentication / Client side flow<br />Http request<br />HTTP 302<br />(redirect_url)<br />Pass URI fragment with access_token<br />
    44. 44. current and future<br />
    45. 45. Current: Data crawler<br />Get public data at first<br />Get friends’ public data<br />Build popular application to link Facebook user<br />
    46. 46. Future: Data crawler provider in Cloud<br />Design as provider<br />Deploy and administration in Azure<br />Get grant and permission automatically or other way<br />
    47. 47. Other Social<br />Twitter<br />t.Sina<br />Linkedin<br />
    48. 48. Thanks<br />:- ), @anytao<br />
    49. 49. http://www.facebook.com/<br />http://anytao.net/blog<br />Reference<br />

    ×