Question

I’m trying to allow users to post videos on my site by supplying only the URL. Right now I’m able to allow YouTube videos by just parsing the URL and obtaining the ID, and then inserting that ID into their given “embed” code and putting that on the page.

This limits me to only YouTube videos however, what I’m looking to do is something similar to facebook where you can put in the YouTube “Share” URL OR the url of the page directly, or any other video url, and it loads the video into their player.

Any idea how they do this? or any other comparable way to just show a video based just on a URL? Keep in mind that youtube videos (which would probably be most popular anyway) don’t give the video url, but the url to the video on the YouTube page (which is why their embed code is needed with just the ID).

Hopefully this made sense, and I hope somebody might be able to offer me some advice on where to look!

Thanks guys.

Answer 1

I would suggest adding support for OpenGraph attributes, which are common among content services which work to enable other sites to embed their content. The information on the pages will be contained in their <meta> tags, which means you would have to load the URL via something like the HtmlAgilityPack:

var doc = new HtmlDocument();
doc.Load(webClient.OpenRead(url)); // not exactly production quality

var openGraph = new Dictionary<string, string>();
foreach (var meta in doc.DocumentNode.SelectNodes("//meta"))
{
    var property = meta["property"];
    var content = meta["content"];
    if (property != null && property.Value.StartsWith("og:"))
    {
        openGraph[property.Value]
            = content != null ? content.Value : String.Empty;
    }
}

// Supported by: YouTube, Vimeo, CollegeHumor, etc
if (openGraph.ContainsKey("og:video"))
{
    // 1. Get the MIME Type
    string mime;
    if (!openGraph.TryGetValue("og:video:type", out mime))
    {
        mime = "application/x-shockwave-flash"; // should error
    }

    // 2. Get width/height
    string _w, _h;
    if (!openGraph.TryGetValue("og:video:width", out _w)
     || !openGraph.TryGetValue("og:video:height", out _h))
    {
        _w = _h = "300"; // probably an error :)
    }

    int w = Int32.Parse(_w), h = Int32.Parse(_h);

    Console.WriteLine(
        "<embed src=\"{0}\" type=\"{1}\" width=\"{2}\" height=\"{3}\" />",
        openGraph["og:video"],
        mime,
        w,
        h);
}