Foundations of a Social Application Platform


Published on

This deck runs through some of the core utilities used by many of the social networking sites out today to host third party applications on their sites, taken from the perspective of OpenSocial containers such as the Yahoo! Application Platform, MySpace, Orkut, etc.

Providing an in depth look into open standards for security, authentication and cross platform migrations, this presentation seeks to compare some of the major platform implementations currently used and provide code examples on how to build real world applications.

Published in: Technology
  • Be the first to comment

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide
  • Community ResourcesHelping you be successful in using Yahoo! Web Services isn't just about code and documentation. We want to make it easy for developers to get in touch with us and others who are using our services to answer and ask questions, toss around ideas, and give your feedback on what services we could offer next.ForumsYDN General BoardsDesign PatternsHotJobsSearchYOSAPTMusicWidgetsGeoPlanetOpenIDY! GroupsAddress BookAnswersFireEagleDel.icio.usTrafficFlickrMailSearchBOSSMapsJavaScriptSilverlightMerchant SolutionsSearch MarketingExceptional PerformanceYUIJava.NetFlashYDN EUAuthPHPPythonRubyPerlEventsWant your tech event appear in the YDN 'Upcoming Events' stream on homepage? List your event on Upcoming and then add it to the Yahoo! Developer Network group on Upcoming. If you are setting up a tech event for developers or designers and would like some Yahoo! involvement, please contact us.ExpertsYahoo! Developer Network is on the lookout for experts to share knowledge and help grow our developer communities. If you are interested in applying to moderate a *group* or forum and become an official expert, please contact us for more information. Remember, we pay in hugs, link-love and schwag only.BlogThe YDN blog is where we talk about our various Yahoo! developer offerings and YDN events around the world. Your comments welcome. If you have a suggestion for the blog or a blog post you'd like to write about your experiences using our APIs or services, let us know. We are particularly interested in posts using Yahoo! APIs, tools, webservices and coverage of tech events. If you need inspiration or want to run some ideas by us, please contact us.YDN TheaterYDN Theater is chock-full of API deep dives, developer interviews, cutting- edge technologies, and recaps of tech events you wish you hadn't missed. If you have an idea for a story, please contact us.
  • Authentication ModelOAuth is a simple, secure, and quick way to publish and access protected data (photos, videos, contact list). It's an open authentication model based primarily on existing standards that ensures secure credentials can be provisioned and verified by different software platforms.In other words, OAuth allows you to share your private resources stored on one site with another site without having to hand out your user name and password.For a visitor to your site, OAuth is completely transparent. The user experience will be specific to the implementation of both the site requesting access and the one storing the resources, and will adjust to the device being used (web browser, mobile phone, PDA, set-top box).Example user flow:A developer has created an application which will allow his users to represent their presence using the Yahoo! Status web service. Once the developer signs up for an OAuth API Key and Secret (provided by Yahoo!), they may access Yahoo's OAuth API to establish the credentials used to access this data from Yahoo! Status. When a user interacts with the developer's application, they are redirected to Yahoo's authentication page, where they sign into their Yahoo! account, then grant the application access to their Yahoo! Status data. A user-authorized token is returned to the application which can be used to access this data.How Do I Get Started?Get an API KeyRead the online documentationGet our PHP SDK or Flash SDK (optional)Using the API or Web ServiceFor an illustration of the OAuth authentication flow, check out the Yahoo! OAuth Quick Start Guide.In order to communicate with their target user's Yahoo services through OAuth, developers must first authenticate requests using Yahoo! OAuth.Here are the steps you take to enable users to access your application:1) Sign Up and Get your API Key2) Get a Request Token3) Get User Approval4) Exchange the Request Token for an Access TokenSupport and CommunityQuestions and suggestions on the OAuth API are discussed on the Yahoo! OAuth Developer Community forum. If you have questions or need technical support, please use this forum.Terms of UseUse of the Yahoo! OAuth API is governed by the Yahoo! APIs Terms of Use.The OAuth StandardYahoo!'s OAuth implementation is fully compliant with OAuth Core 1.0 and the OAuth Session Extension draft (1). In order to support OAuth in a scalable way, Yahoo! proposed and helped create the OAuth Session Extension together with AOL and Google. The extension is currently being added to all the major OAuth client libraries as well as the Y!OS SDK. For more information on the standard, visit:
  • Missed connections, this is how you find them.
  • Foundations of a Social Application Platform

    1. 1. The Foundations of a Social Application Platform<br />Jonathan LeBlanc<br />Technology Evangelist<br />Yahoo! Developer Network<br />Twitter: @jcleblanc<br />
    2. 2. EXAMPLES | TUTORIALS | CODE SAMPLES<br /><br />
    3. 3. Review Topics – What Will We Explore<br /><ul><li>Open Identification (OpenID)
    4. 4. Open Authentication (OAuth)
    5. 5. Software Development Kits (SDKs)
    6. 6. OpenSocial and Using Social Data
    7. 7. Application Security
    8. 8. Querying Languages</li></li></ul><li>Open ID – Single Account Sign-in<br />
    9. 9. OAuth - Open Authentication<br />
    10. 10.
    11. 11. OAuth – What Does the End-User See?<br />
    12. 12. OAuth – What Does the End-User See?<br />
    13. 13. SDKs (Software Development Kits)<br />PHP, Python, Java, ActionScript 3,<br />Objective-C, and OpenSocial REST APIs<br /><br />
    14. 14. SDKs (Software Development Kits) – Abstraction Using PHP<br />//create session variables<br />$ysession = YahooSession::requireSession(API_KEY, API_SECRET, APP_ID);<br />$yuser = $ysession->getSessionedUser();<br />//get user profile<br />$yprofile = $yuser->loadProfile(); <br />//get user connections<br />$connections = $yuser->getConnections($start,$count, $total);<br />
    15. 15. What is OpenSocial?<br />For developing applications on social networks<br />Accessing social data (profiles, connections) <br />Fetching and inserting activities<br />Implemented by many containers<br />YAP, MySpace, Orkut, etc.<br />Develop once, distribute broadly<br />
    16. 16.
    17. 17. Collecting User Data With OpenSocial 0.8<br />/* OpenSocialPERSON data request */<br />varreq = opensocial.newDataRequest(); <br />varparams = {};<br />params[opensocial.DataRequest.PeopleRequestFields.PROFILE_DETAILS] = [<br />opensocial.Person.Field.NAME,<br />opensocial.Person.Field.THUMBNAIL_URL<br />];<br />req.add(req.newFetchPersonRequest('VIEWER', params), 'viewer_profile');<br />req.send(response);<br />
    18. 18. Collecting User Data With OpenSocial 0.8<br />/* response handler */<br />function response(data){<br /> var viewer = data.get('viewer_profile').getData();<br /> var aboutme =<br /> viewer.getField(opensocial.Person.Field.NAME);<br />}<br />
    19. 19. Fetching Updates with OpenSocial 0.8<br />
    20. 20. Getting Updates With OpenSocial 0.8<br />var req = opensocial.newDataRequest();<br />var spec = new opensocial.IdSpec();<br />spec.setField(opensocial.IdSpec.Field.USER_ID, opensocial.IdSpec.PersonId.OWNER);<br />req.add(req.newFetchActivitiesRequest(spec), 'ownerActivities');<br />req.send(handleActivities);<br />
    21. 21. Getting Updates With OpenSocial 0.8<br />function handleActivities(dataResponse) {<br />varownerActivities =<br />dataResponse.get('ownerActivities').getData();<br /> //parse owner activities<br />}<br />
    22. 22. Inserting Updates with OpenSocial 0.8<br />var params = {}, activity;<br />params[opensocial.Activity.Field.TITLE] = title;<br />params[opensocial.Activity.Field.BODY] = body;<br />activity = opensocial.newActivity(params);<br />opensocial.requestCreateActivity(<br /> activity,<br /> opensocial.CreateActivityPriority.LOW,<br /> callback);<br />
    23. 23. Fetching Connections With OpenSocial 0.8<br />
    24. 24. Fetching Connections With OpenSocial 0.8<br />/* get owner and owner friends */<br />varidspec = opensocial.newIdSpec({ 'userId' : 'OWNER', 'groupId' : 'FRIENDS' });<br />varreq = opensocial.newDataRequest();<br />req.add(req.newFetchPeopleRequest(idspec), 'get_friends');<br />req.send(responseFriends);<br />
    25. 25. Fetching Connections With OpenSocial 0.8<br />/* connection response function */<br />function responseFriends(data){<br />varobjFriends = data.get('get_friends').getData();<br />var html = '';<br />objFriends.each(function(person) {<br /> html += person.getDisplayName() + '<br />';<br /> });     <br />}<br />
    26. 26. Front-end Security<br />
    27. 27. Front-end Security: IFrames<br />IFrames - Pros<br /><ul><li>Quick to set up
    28. 28. Full content control for developers</li></ul>IFrames - Cons<br /><ul><li>Drive-by downloads, etc.
    29. 29. No content restrictions</li></li></ul><li>Front-end Security: Caja<br />Caja - Pros<br /><ul><li>Very secure model (whitelist)
    30. 30. Aims to protect end-users
    31. 31. Platform has full content control</li></ul>Caja - Cons<br /><ul><li>Slow to set up
    32. 32. Difficult to configure
    33. 33. User does not have full content control</li></li></ul><li>Front-end Security: Caja Cajoling Process<br /><script type="text/javascript"><br />function response(obj) {<br /> if (obj.text){<br />document.getElementById('interact').setInnerHTML('Populated!');<br />document.getElementById('population').setInnerHTML(obj.errors);<br /> }<br />}<br /></script><br />
    34. 34. Front-end Security: Caja Cajoling Process<br />var $dis = $v.getOuters(); <br />$v.initOuter('onerror'); <br />$'response', ___.markFuncFreeze(function () { <br />function response$_caller($dis, obj) { <br /> if ($v.r(obj, 'text')) { <br /> $$$'document'), 'getElementById', [ 'interact' ]), <br /> 'setInnerHTML', [ 'Populated!' ]); <br /> $$$'document'), 'getElementById', [ 'population' ]), <br /> 'setInnerHTML', [ $v.r(obj, 'errors') ]); <br /> } <br />} <br />response$_caller.FUNC___ = 'response$_caller'; <br />var response;; <br />response = $v.dis(___.primFreeze(response$_caller), 'response'); <br />return response; <br />
    35. 35. Querying Languages<br />
    36. 36. Querying Languages – Yahoo! Query Language (YQL)<br />
    37. 37. Conclusion<br /><ul><li>Use Open Source Technologies
    38. 38. Abstract difficult programming tasks with SDKs
    39. 39. Leverage the Social Graph
    40. 40. Understand your application security</li></li></ul><li>Questions?<br /><br />