My friend, former colleague, and fellow Elegant Coder, Cory Isakson, has graciously allowed me to open source his .NET oEmbed library. Cory and I have been using this library for about two years, and a derivative of the library has been in production at an internet media company for nearly as long.

The library is hosted on GitHub at:

https://github.com/codeprogression-opensource/OptionStrict.oEmbed

As far as I know, there is only one other open-source oEmbed library available for .NET. It is written in VB.NET and is hosted on CodePlex at:

http://oembed.codeplex.com

For the uninitiated:

oEmbed is a format for allowing an embedded representation of a URL on third party sites.

The simple API allows a website to display embedded content (such as photos or videos) when a user posts a link to that resource, without having to parse the resource directly.

http://oembed.com

Now, what does that mean?

Third-parties, such as YouTube, Flickr, Hulu, GrooveShark, CNN, etc. have resources that you want to embed on your site.

There are different types of resources you can embed:

• Photo: represents static photos
• Video: represents playable videos
• Link: represents generic data (i.e., a link to the author’s site or downloadable content)
• Rich: any other type not represented above

You send a web request to the API URL of the provider with the url of the resource, and the provider sends you a response with metadata about the resource as well as representations of the resource.

Let’s get a video of the skit SNL’s “Undercover Celebrity Boss” from Hulu.

To get the resource, I need the API and Resource URL’s…

API: http://www.hulu.com/api/oembed.{format}

Resource: http://www.hulu.com/watch/131076/saturday-night-live-undercover-celebrity-boss

Now, if I click on the resource link, I go to Hulu, but I want to embed the video in my site.

To do that, I make a request to Hulu’s oEmbed API, like so:

http://www.hulu.com/api/oembed.json?url=http://www.hulu.com/watch/131076/saturday-night-live-undercover-celebrity-boss&maxwidth=200

That request returns the following (notice how I asked for a specific size):

{
  "duration": 102.7,
  "type": "video",
  "provider_url": "http://www.hulu.com/",
  "embed_url": "http://www.hulu.com/embed/YdmSIZmY6plQhyhHSceW2A",
  "author_name": "NBC",
  "cache_age": 3600,
  "height": 200,
  "width": 115,
  "html": "<object width="200" height="115"><param name="movie"
       value="http://www.hulu.com/embed/YdmSIZmY6plQhyhHSceW2A"></param>
       <param name="flashvars" value="ap=1"></param>
       <embed src="http://www.hulu.com/embed/YdmSIZmY6plQhyhHSceW2A"
        type="application/x-shockwave-flash" width="200" height="115"
       flashvars="ap=1"></embed></object>",
  "air_date": {},
  "title": "Undercover Celebrity Boss (Saturday Night Live)",
  "thumbnail_width": 200,
  "version": "1.0",
  "thumbnail_url":
      "http://thumbnails.hulu.com/265/50037265/148745_145x80_generated.jpg",
  "thumbnail_height": 110,
  "provider_name": "Hulu"
}

To embed this in my page, I just need to add the html embed code I received to my page.

OptionStrict.oEmbed attempts to make this process a little more streamlined, giving you the ability to consume oEmbed streams, as well as provide an oEmbed API endpoint. More to come!

Richard Cirerol