Programming Social Applications

Jonathan LeBlancPrincipal Software EngineerYahoo! Developer Network

Twitter: @jcleblancWeb: http://www.jcleblanc.com

Programming Social Applications

What We’re Going to Cover

• The Social Application: Core Concepts

• Finger to Webfinger: Find User Social Data

• Return of the Semantic Web: The Open Graph Protocol

• Defining User Actions: Activity Streams

• Controlling Content Syndication: PubSubHubbub and Salmon







Core Concepts: What is a Social Application?

Core Concepts: What Makes up a Social Application?

Sharing Model

The Social Graph

Relationship Model

Core Concepts: The Social Graph

Core Concepts: Applying the Real Life Social Graph Online

Core Concepts: The Different Sharing Models

The Opt-in Model

The Opt-out Model

Core Concepts: Relationship Models

Group Model

Connection Model

Follower Model







WebFinger

http://code.google.com/p/webfinger/

WebFinger: Origin Through the Finger Protocol

Login name: jleblancIn real life: Jonathan LeBlancHome phone: 123-4567Office: Sunnyvale, CALast Login: Tue Jun 21 15:41 on ttys000

[email protected]://www.jcleblanc.com

finger [email protected]

WebFinger: How it Works



WebFinger: Performing WebFinger Discovery

<XRD xmlns='http://docs.oasis-open.org/ns/xri/xrd-1.0' xmlns:hm='http://host-meta.net/xrd/1.0'> <hm:Host xmlns='http://host-meta.net/xrd/1.0'> gmail.com</hm:Host> <Link rel='lrdd' template= 'http://www.google.com/s2/webfinger/?q={uri}'> <Title>Resource Descriptor</Title> </Link></XRD>

curl http://gmail.com/.well-known/host-meta

WebFinger: Performing WebFinger Discovery

The User Profile: http://www.google.com/profiles/nakedtechnologist

The portable contacts link: http://www-opensocial.googleusercontent.com/api/people/118167121283215553793/

The public Google Buzz feed: https://www.googleapis.com/buzz/v1/activities/118167121283215553793/@public

curl http://www.google.com/s2/webfinger/[email protected]

http://www.google.com/profiles/nakedtechnologist

http://www-opensocial.googleusercontent.com/api/people/118167121283215553793/

http://www-opensocial.googleusercontent.com/api/people/118167121283215553793/

https://www.googleapis.com/buzz/v1/activities/118167121283215553793/@public

https://www.googleapis.com/buzz/v1/activities/118167121283215553793/@public

WebFinger: Homework

Using the well-known host-meta file, attempt to obtain your public profile from www.yahoo.com

http://www.yahoo.com/







The Open Graph Protocol

http://ogp.me/

Open Graph Protocol: How Web Semantics Work

Open Graph Protocol: How Web Semantics Work

Geo<span class="geo"> <span class="latitude">52.48</span>, <span class="longitude">-1.89</span></span>

vCard<div class="vcard"> <div class="fn">Joe Doe</div> <div class="org">The Example Company</div> <div class="tel">604-555-1234</div> <a class="url" href="http://site.com/">http://site.com/</a> </div>

Open Graph Protocol: Vision of the Semantic Web

Open Graph Protocol: Reality of the Semantic Web

Open Graph Protocol: What Changed?

Open Graph Protocol: How it Works



Open Graph Protocol: The Meta Data Format

<html xmlns:og="http://ogp.me/ns#"><head><title>Restaurant at Wente Vineyards – Livermore</title><meta property="og:url" content="http://www.yelp.com/biz/gATFcG9HTaXJpg"><meta property="og:type" content="restaurant"> <meta property="og:title" content="The Restaurant at Wente Vineyards"> <meta property="og:image" content="http://media2.px.yelpcdn.com/iVSnIs"> ...</head>...</html>

Open Graph Protocol: What is Defined?

• Basic Metadata• Location• Contact Information• Video Data• Audio Data• Objects

• Activities• Businesses• Groups• Organizations

• People• Places• Products and Entertainment• Websites

Open Graph Protocol: Drawbacks

How do we differentiating like objects from one another?

How do we define definitions for an entire page versus a single object?

Open Graph Protocol: Homework

Construct an Open Graph meta-data parser, then extract Open Graph meta-data from a restaurant page on www.yelp.com

Hint: The www.ogp.me page has parser helpers.

http://www.yelp.com/

http://www.ogp.me/







Activity Streams

http://activitystrea.ms/

Activity Streams: What is an Activity?

Activity Streams: What is an Activity?

• Photo: The Object

Mary added to a new photo into her collection.

• Mary: The Actor

• Collection: The Target

Activity Streams: The Standard JSON Object

{ "items" : [{ "verb": "post", "published": "2011-02-18T16:26:43Z", "provider": { "url": "http://providersite.com/activity-stream" }, "title": "Mary added a photo to her album.", "actor": { ... }, "object" : { ... }, "target": { ... } }]}

Activity Streams: The Actor

"actor": { "url": "http://providersite.com/mary", "objectType": "person", "id": "tag:provider.com,20110218,162643:mary", "image": { "url": "http://providersite.com/mary/image", "width": 125, "height": 125 }, "displayName": "Mary Smith"},


Activity Streams: The Object

"object" : { "url": "http://site.com/mary/album/place.jpg", "objectType": "http://activitystrea.ms/schema/1.0/photo", "id": "tag:provider.com,20110218,162643:place", "image": { "url": "http://site.com/mary/album/thumb.jpg", "width": 100, "height": 100 }},


Activity Streams: The Target

"target": { "url": "http://targetsite.com/mary/album/", "objectType": "http://activitystrea.ms/schema/1.0/ photo-album", "id": "tag:example.org,20110218,162643:album4323", "displayName": "Mary's Photo Album", "image": { "url": "http://site.com/mary/album/thumbnail.jpg", "width": 100, "height": 100 }}


Activity Streams: Object Properties

Object PropertiesattachmentsauthorcontentdisplaynamedownstreamDuplicatesidimage

objecttypepublishedsummaryupdatedupstreamDuplicatesurl

Media Object Propertiesdurationheight

url width

Activity Streams: Homework

Take one of your activities (with a photo) from Facebook and convert it to an activity stream object.







PubSubHubbub

http://code.google.com/p/pubsubhubbub/

PubSubHubbub: How it Works





The Salmon Protocol

www.salmon-protocol.org

The Salmon Protocol: How it Works



The Salmon Protocol: Things to Consider

• How does the publisher prevent spam or abuse?

• Is the content coming from a trusted source?

• How does the publisher ensure the quality of the updates?

The Salmon Protocol: Determining Source

1. Subscriber sends signed request to publisher (e.g. using acct:[email protected]).

2. Publisher performs discovery on endpoint to verify identity provider.

• Webfinger• LRDD (Link-based Resource Descriptor)

3. Provider verifies signature via public keys obtained during discovery.

Pubsubhubbub and Salmon: Homework

Construct a subscriber to subscribe to a hub, then create a publisher to push a feed to a hub.

Hint: www.superfeedr.com has a hosted hub solution at http://superfeedr.com/hubbub

http://www.superfeedr.com/

http://superfeedr.com/hubbub







Resources

This Presentation:http://www.slideshare.net/jcleblanc/programming-social

Code Sources:https://github.com/jcleblanc/programming-social-applications

Purchase the Book:Amazon: http://amzn.to/mQrUkE O’Reilly: http://oreil.ly/gzEKiM O’Reilly ebook code (50% off): DDM97

Follow Updates:Facebook: www.facebook.com/programmingsocialappsTwitter: @socialappsbook

http://www.slideshare.net/jcleblanc

http://www.slideshare.net/jcleblanc

https://github.com/jcleblanc/programming-social-applications

http://amzn.to/mQrUkE

http://oreil.ly/gzEKiM

http://www.facebook.com/programmingsocialapps

Questions?

http://www.slideshare.net/jcleblanc/slideshare.net/jcleblanc/programming-social

Jonathan LeBlanc

Twitter: @jcleblanc

E-Mail: [email protected]

Technology

Programming Social Applications