Monday, 18 February 2013

Displaying YouTube videos in ASP.NET MVC Application

 Following this tutorial you will be able to get videos from channel and display them in a view. Channel name is hard coded to "blendercookie". It is very easy to pass the parameter from view Text box to controller with the channel name, but for this example I will leave it hard coded. 

I used Visual Studio 2010, MVC 3, C# and Razor syntax.

1       Download 3 packages from NuGet: 
 In you package manager console type:
      ○     Install-Package Google.GData.YouTube
     Install-Package Google.GData.Client
     Install-Package Google.GData.extensions

Once you successfully install those packages you will see new dll’s under reference folder

You will need to obtain unique google developer key. To do this go to
2      Write a new class inside Model.

This model is a List of YouTube objects with Youtube name and videoID

    public class YouTube
        public string YouTubeMovieID { get; set; }
        public string YouTubeMovieTitle { get; set; }

    public class YouTubeHelper
        const string YT_CHANNEL_NAME = "blendercookie";
        const string YT_DEVELOPER_ID = "SOMETHING LIKE THAT : AI39si4MmBNkAvglhJrirLO19NpGcehhfdhdfDyT1qHRigohHdYDw8Lj2l_G_6djdfjdFQPGnGFTfxpwewuhJMukVxUZjmXA";

        public static List<YouTube> GetVideos()
            YouTubeRequestSettings ytSettings = new YouTubeRequestSettings("YouTubeTest", YT_DEVELOPER_ID);
            YouTubeRequest ytRequest = new YouTubeRequest(ytSettings);
            string feedURL = String.Format("{0}/uploads?orderby=published", YT_CHANNEL_NAME);
            Feed<Video> videoFeed = ytRequest.Get<Video>(new Uri(feedURL));
            return (from video in videoFeed.Entries
                    select new YouTube() { YouTubeMovieID = video.VideoId, YouTubeMovieTitle = video.Title }).ToList();


3. In controller create a model YouTubeHelper

        public ActionResult YouTube()
            var videos = YouTubeHelper.GetVideos();
            return View(videos);

4. Finally in View display youtube videos.


@foreach (var v in Model)
<object width="427" height="258">
           <param name="movie" value="" />
           <param name="allowFullScreen" value="true" />
           <param name="allowscriptaccess" value="always"/>
           <param name="wmode" value="opaque" />
           <embed src=""
              type="application/x-shockwave-flash" width="427"
              height="258" allowscriptaccess="always" allowfullscreen="true"
              wmode="opaque"></embed>  </object>

Modify _Layout file from Shared folder so you can add link to youtube view. Find ul with        id=”menu” and add new ActionLink.

<ul id="menu">
                    <li>@Html.ActionLink("Home", "Index", "Home")</li>
                    <li>@Html.ActionLink("About", "About", "Home")</li>
                    <li>@Html.ActionLink("YouTube", "YouTube", "Home")</li>

That’s how your website should look like once you finish.


  1. Thanx for the code. But it shows only one kind of video. What changes should I do to for other various category

  2. when i follow the link to get a unique google key, i receive a 404 error? any help???

  3. Great post thanks. Any idea on how I can return the videos from a channel but filter them by what they are tagged as?