Click here to Skip to main content
Click here to Skip to main content

Displaying Videos from YouTube Channel in ASP.NET Website

, 8 Jun 2011
Rate this:
Please Sign up or sign in to vote.
How to display Videos from YouTube channel in ASP.NET website
Video from YouTube

Introduction

YouTube is firmly entrenched in our lives. Now, many users cannot imagine life without the use of this site. Due to the simplicity and ease of use, YouTube has become the most popular video sharing and one of the most popular websites in the world. Like many popular Google services, YouTube has Data API. This API allows you to interact with this service. This opens up great opportunities for developers of sites and various applications. Using this API, developers can query videos, search videos, upload videos on YouTube, create and read reviews and more.

Problem

Our goal is to query all the videos from YouTube channel of the famous Russian DJ and show them on the website.

Solution of the Problem

  1. To work with YouTube Data API, you need to download and install the Google Data API library. Then copy Google.GData.Client.dll, Google.GData.YouTube.dll, Google.GData.Extensions.dll files into the Bin folder of the website project and add references to them. How to do this was described in detail in my other article, Using Google Calendar in an ASP.NET website.
  2. To use all possibilities that YouTube Data API offered, you need to get Developer Key.
    Developer key uniquely identifies an application that will interact with the YouTube service. You can get it here.
  3. Let’s create a class to represent YouTube video on our site. The object of this class is a video that has properties: VideoId and Title.
    VideoId represents unique identifier for the video on YouTube and Title is the title of the video on YouTube:
    public class YouTubeVideoObject
       {
           public string VideoId { get; set; }
           public string Title { get; set; }
       }
  4. Let’s create a class that will interact with YouTube, and return us all the videos (objects of YouTubeVideoObject class) of channel:
    public class YouTubeVideoHelper
       {
           const string YOUTUBE_CHANNEL = "BobinaMusic";
           const string YOUTUBE_DEVELOPER_KEY = "AI39si6JqO_f2b_JWSV3QUbcwg5S-1RJ4-
    	kiieosBZy9r1ORkCAv7BT5tLp579Tzmly8rvOVm3Jyueq3ZVqUNt1blS4DcoVppA";
    
           public static YouTubeVideoObject[] GetVideos()
           {
               YouTubeRequestSettings settings =
               new YouTubeRequestSettings("Bobina Channel", YOUTUBE_DEVELOPER_KEY);
               YouTubeRequest request = new YouTubeRequest(settings);
               string feedUrl = String.Format
               ("http://gdata.youtube.com/feeds/api/users/{0}/uploads?orderby=published", 
    		YOUTUBE_CHANNEL);
               Feed<Video> videoFeed = request.Get<Video>(new Uri(feedUrl));
               return (from video in videoFeed.Entries
                        select new YouTubeVideoObject()
                        {VideoId = video.VideoId, Title = video.Title}).ToArray();
           }
       }

    Description of Constants

    • YOTUBE_CHANNEL - Channel from which we will show videos
    • YOUTUBE_DEVELOPER_KEY - Developer key, obtained in step 2

    Description of GetVideos() Method

    To perform any action on YouTube Data API, it is necessary to create an object of YouTubeRequest class, passed an object of YouTubeRequestSettings class as a parameter to constructor. YouTubeRequestSettings class specifies application name (in fact, it is any string) and Developer key:

    YouTubeRequestSettings settings = 
    	new YouTubeRequestSettings("Bobina Channel", YOUTUBE_DEVELOPER_KEY);
    YouTubeRequest request = new YouTubeRequest(settings);

    Next, we need to compose URL from which we read the videos. After that, we use Get() method of YouTubeRequest class to get object of Feed class. This object contains a set of YouTubeEntry objects. Each object of YouTubeEntry class contains relevant information about the video:

    string feedUrl = String.Format
    ("http://gdata.youtube.com/feeds/api/users/{0}/uploads?orderby=published",   
    YOUTUBE_CHANNEL);
    Feed<Video> videoFeed = request.Get<Video>(new Uri(feedUrl));

    Then, we get an array of YouTubeVideoObject objects (this class has been created by us in step 3.) and return it from the method:

    return (from video in videoFeed.Entries select new YouTubeVideoObject()
    {VideoId = video.VideoId, Title = video.Title}).ToArray();      
  5. Now we have an array of videos (an array of YouTubeVideoObject objects). All we need to do is to show these videos on our web site. To do this, create the following code in aspx page of the website:
    <asp:Repeater ID="VideosRepeater" runat="server">
       <ItemTemplate>
          <%# Eval("Title") %> <br />
          <object width="427" height="258">
               <param name="movie" value="http://www.youtube.com/v/
    		<%# Eval("VideoId") %>"></param>
               <param name="allowFullScreen" value="true"></param>
               <param name="allowscriptaccess" value="always"></param>
               <param name="wmode" value="opaque"></param>
               <embed src="http://www.youtube.com/v/<%# Eval("VideoId") %>?" 
    		type="application/x-shockwave-flash" width="427" 
    		height="258" allowscriptaccess="always" allowfullscreen="true" 
    		wmode="opaque"></embed>
             </object>
       </ItemTemplate>
       <SeparatorTemplate>
         <br />
       </SeparatorTemplate>
       </asp:Repeater>

    The code consists of object tag that allows to embed YouTube video in website. This code is wrapped into Repeater to list all obtained YouTube videos. Note that we use <%# Eval() %> data-binding expression, to get Title and VideoId of underlying YouTubeVideoObject object.

    After that, we just need to bind array of videos to Repeater control:

    protected override void OnLoad(EventArgs e)
        {
               base.OnLoad(e);
               VideosRepeater.DataSource = YouTubeVideoHelper.GetVideos();
               VideosRepeater.DataBind();
        }

The result will look like this:

Video from YouTube

Conclusion

In this article, we examined the interaction with YouTube service to display videos from YouTube channel on our website. Data API provides a rich set of features to interact with YouTube. This opens up wide horizons for developers to be creative.

History

  • 6th June, 2011: Initial version

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

About the Author

Igor Alekseev
Technical Lead UBS
Russian Federation Russian Federation
Currently Technical Lead at UBS. MCTS, MCPD.

Comments and Discussions

 
QuestionThe videos where presented but sttoped PinmemberMember 1063481826-May-14 6:51 
QuestionPlease sample on YouTube.V3 PinmemberTruong Minh Tam4-Apr-14 17:20 
QuestionDisplaying Videos from YouTube Channel in ASP.NET Website Pinmembersheshu25526-Feb-14 23:51 
GeneralDisplaying Videos from YouTube Channel in ASP.NET Website Pinmembersheshu25526-Feb-14 23:45 
GeneralThanks Pinmemberniravmmehta11-Jan-14 0:27 
QuestionFinally Pinmemberojorma10-Jan-14 9:26 
QuestionHow can I list all the videos Pinmemberdemouser74321-Oct-13 0:09 
GeneralMy vote of 4 Pinprofessionaldholakiya ankit6-Sep-13 0:43 
QuestionGoogle API deprecated. How to do it with current method? PinmemberChas20035-Aug-13 7:55 
Questionabout video display PinmemberMember 824146616-Apr-13 7:21 
QuestionOne confusion PinmemberAnurag Sinha V5-Apr-13 10:22 
GeneralMy vote of 5 Pinmemberdpalash15-Mar-13 2:25 
QuestionNice article Pinmemberssampath1-Mar-13 22:22 
QuestionIs there an MVC method? Pinmemberdanbeaulieu8-Feb-13 12:59 
BugIt's not load all list of channel videos Pinmemberk374628-Jan-13 6:20 
Questionhow to display thimbnail preview of videos Pinmemberdeepaktri20-Jan-13 19:31 
GeneralMy vote of 5 PinmemberMember 96642718-Dec-12 12:19 
Questionthe source code is not downloaded. Pinmembersugyani dash5-Sep-12 21:57 
QuestionJust one video on time PinmemberZalemx1-Aug-12 7:26 
AnswerRe: Just one video on time [modified] PinmemberDevNet8426-Oct-12 11:03 
QuestionHow to know the user watch finish the video or not ? PinmemberBquangngai27-Jul-12 0:13 
GeneralMy vote of 5 PinmemberMember 41481886-Jul-11 20:08 
GeneralNice & Useful. Pinmemberalrsds14-Jun-11 5:21 
Generalexcellent article Pinmemberyuvachandra9-Jun-11 20:37 
GeneralMy vote of 5 PinmemberArlen Navasartian8-Jun-11 11:27 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

| Advertise | Privacy | Mobile
Web03 | 2.8.140721.1 | Last Updated 8 Jun 2011
Article Copyright 2011 by Igor Alekseev
Everything else Copyright © CodeProject, 1999-2014
Terms of Service
Layout: fixed | fluid