foundations of a social application platform
DESCRIPTION
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.TRANSCRIPT
Jonathan LeBlancTechnology Evangelist
Yahoo! Developer NetworkTwitter: @jcleblanc
The Foundations of a Social Application Platform
DEVELOPER.YAHOO.COMEXAMPLES | TUTORIALS | CODE SAMPLES
Review Topics – What Will We Explore
• Open Identification (OpenID)
• Open Authentication (OAuth)
• Software Development Kits (SDKs)
• OpenSocial and Using Social Data
• Application Security
• Querying Languages
Open ID – Single Account Sign-in
OAuth - Open Authentication
OAuth – What Does the End-User See?
OAuth – What Does the End-User See?
SDKs (Software Development Kits)
PHP, Python, Java, ActionScript 3,Objective-C, and OpenSocial REST APIs
http://www.github.com/yahoo
SDKs (Software Development Kits) – Abstraction Using PHP
//create session variables$ysession = YahooSession::requireSession(API_KEY,
API_SECRET, APP_ID);$yuser = $ysession->getSessionedUser();
//get user profile$yprofile = $yuser->loadProfile();
//get user connections$connections = $yuser->getConnections($start,$count,
$total);
What is OpenSocial?
For developing applications on social networks– Accessing social data (profiles, connections) – Fetching and inserting activities
Implemented by many containers– YAP, MySpace, Orkut, etc.– Develop once, distribute
broadly
Collecting User Data With OpenSocial 0.8
/* OpenSocial PERSON data request */
var req = opensocial.newDataRequest(); var params = {};params[opensocial.DataRequest.PeopleRequestFields.PROFILE_DETAILS] = [ opensocial.Person.Field.NAME, opensocial.Person.Field.THUMBNAIL_URL];
req.add(req.newFetchPersonRequest('VIEWER', params), 'viewer_profile');req.send(response);
Collecting User Data With OpenSocial 0.8
/* response handler */function response(data){ var viewer = data.get('viewer_profile').getData(); var aboutme = viewer.getField(opensocial.Person.Field.NAME);}
Fetching Updates with OpenSocial 0.8
Getting Updates With OpenSocial 0.8
var req = opensocial.newDataRequest();var spec = new opensocial.IdSpec();
spec.setField(opensocial.IdSpec.Field.USER_ID, opensocial.IdSpec.PersonId.OWNER);
req.add(req.newFetchActivitiesRequest(spec), 'ownerActivities');
req.send(handleActivities);
Getting Updates With OpenSocial 0.8
function handleActivities(dataResponse) { var ownerActivities = dataResponse.get('ownerActivities').getData(); //parse owner activities}
Inserting Updates with OpenSocial 0.8
var params = {}, activity;params[opensocial.Activity.Field.TITLE] = title;params[opensocial.Activity.Field.BODY] = body;activity = opensocial.newActivity(params);
opensocial.requestCreateActivity(activity,opensocial.CreateActivityPriority.LOW,callback);
Fetching Connections With OpenSocial 0.8
Fetching Connections With OpenSocial 0.8
/* get owner and owner friends */var idspec = opensocial.newIdSpec({ 'userId' :
'OWNER', 'groupId' : 'FRIENDS' });
var req = opensocial.newDataRequest();req.add(req.newFetchPeopleRequest(idspec),
'get_friends');
req.send(responseFriends);
Fetching Connections With OpenSocial 0.8
/* connection response function */function responseFriends(data){ var objFriends = data.get('get_friends').getData(); var html = ''; objFriends.each(function(person) { html += person.getDisplayName() + '<br />'; }); }
Front-end Security
Front-end Security: IFrames
IFrames - Pros• Quick to set up• Full content control for developers
IFrames - Cons• Drive-by downloads, etc.• No content restrictions
Front-end Security: Caja
Caja - Pros• Very secure model (whitelist)• Aims to protect end-users• Platform has full content control
Caja - Cons• Slow to set up• Difficult to configure• User does not have full
content control
Front-end Security: Caja Cajoling Process
<script type="text/javascript">function response(obj) { if (obj.text){
document.getElementById('interact').setInnerHTML('Populated!');
document.getElementById('population').setInnerHTML(obj.errors);
}}</script>
Front-end Security: Caja Cajoling Process
var $dis = $v.getOuters(); $v.initOuter('onerror'); $v.so('response', ___.markFuncFreeze(function () { function response$_caller($dis, obj) { if ($v.r(obj, 'text')) { $v.cm($v.cm($v.ro('document'), 'getElementById',
[ 'interact' ]), 'setInnerHTML', [ 'Populated!' ]); $v.cm($v.cm($v.ro('document'), 'getElementById',
[ 'population' ]), 'setInnerHTML', [ $v.r(obj, 'errors') ]); } } response$_caller.FUNC___ = 'response$_caller'; var response;; response = $v.dis(___.primFreeze(response$_caller), 'response'); return response;
Querying Languages
Querying Languages – Yahoo! Query Language (YQL)
Conclusion
• Use Open Source Technologies
• Abstract difficult programming tasks with SDKs
• Leverage the Social Graph
• Understand your application security
Questions?
http://www.slideshare.net/jcleblanc/foundations-of-a-social-platform