ATTENZIONE: Questo sito impiega diversi tipi di cookies. Alla pagina MAGGIORI INFORMAZIONI è possibile avere informazioni aggiuntive. Cliccando su ACCETTO o continuando a navigare sul sito acconsenti al loro utilizzo.
<settembre 2021>
lunmarmergiovensabdom
303112345
6789101112
13141516171819
20212223242526
27282930123
45678910
Immagini  

YouTube con le Google.Apis V3

Ecco a voi indicazioni molto elementari per visualizzare i video YouTube all'interno delle Universal App usando l'ultima versione delle Google APIs


Attività da fare su Google
  1. Registrate un account google (se già non ce l'avete), e collegatevi alla console degli sviluppatori, al link https://console.developers.google.com
  2. Selezionate il menu hamburger googleYouTubeApi1.JPG
  3. Selezionate la voce API ManagergoogleYouTubeApi2.JPG
  4. Selezionate la voce Credentials, e quindi il bottone Add Credentials, scegliendo l'opzione API Key googleYouTubeApi3.JPG
  5. Alla richiesta ulteriore del tipo di Key da creare, selezionare la voce Browser Key googleYouTubeApi4.JPG
  6. Finalmente potete creare la Key, dandogli un nome googleYouTubeApi5.JPG
  7. Una vola create, potete leggere la Key nell'elenco delle Key googleYouTubeApi6.JPG
  8. Scrivetevi questa Key perché andrà usata nel codice


Attività da fare su Visual Studio 
  1. Create un progetto di tipo Universal App
  2. Tramite NuGet aggiungete i pacchetti google.apis.youtube, MyToolkit e MyToolkit.Extended: il primo serve per recuperare informazioni da YouTube, il secondo e il terzo servono per visualizzare i video usando, ad esempio, il componente MediaElement
  3. E ora passiamo al codice. Per comodità ci creiamo una classe semplicissima che rappresenta il singolo video con le informazioni minime:
  4. VideoId - conterrà l'id del video YouTube (es: https://www.youtube.com/watch?v=tUhIA3pIHSQ )
  5. Title - conterrà il titolo del video
  6. VideoImageUrl - conterrà il link all'immagine di thumbnail del video
Questo il codice della classe
    public class NSPYouTube
    {
        public string Title { get; set; }
        public string VideoImageUrl { get; set; }
        public string VideoId { get; set; }
    }

Nella stessa classe andiamo a creare un paio di metodo statici, il primo per recuperare i video di un determinato canale, il secondo per recuperare i video in base ad una ricerca libera.


        
        public static List<NSPyoutube> listChannel(string myChannel)
        {
            List<NSPyoutube> myRes = new List<NSPyoutube>();
            YouTubeService youtube = new YouTubeService(new BaseClientService.Initializer()
            {
                                 //***********************************
                ApiKey = [myKey] //QUI DEVO INSERIRE LA MIA CHIAVE!!!!
                                 //***********************************
            });
            SearchResource.ListRequest listRequest = youtube.Search.List("snippet");
            listRequest.ChannelId = myChannel;
            listRequest.Order = SearchResource.ListRequest.OrderEnum.Date;
            try
            {
                SearchListResponse searchResponse = listRequest.Execute();
                foreach (SearchResult searchResult in searchResponse.Items)
                {
                    NSPYouTube myVideo = new NSPYouTube();
                    myVideo.VideoId = searchResult.Id.VideoId;
                    myVideo.Title = searchResult.Snippet.Title;
                    myVideo.VideoImageUrl = searchResult.Snippet.Thumbnails.Default__.Url;
                    myRes.Add(myVideo);
                }
            }
            catch (Exception e1)
            {
                //TRAP THE EXCEPTION
                string appo = e1.Message;
            }
            return myRes;
        }






        public static List<NSPyoutube> search(string myQuery)
        {
            List<NSPyoutube> myRes = new List<NSPyoutube>();
            YouTubeService youtube = new YouTubeService(new BaseClientService.Initializer()
            {
                                 //***********************************
                ApiKey = [myKey] //QUI DEVO INSERIRE LA MIA CHIAVE!!!!
                                 //***********************************
            });
            SearchResource.ListRequest listRequest = youtube.Search.List("snippet");
            listRequest.Q = myQuery;
            listRequest.Order = SearchResource.ListRequest.OrderEnum.Rating;
            try
            {
                SearchListResponse searchResponse = listRequest.Execute();
                foreach (SearchResult searchResult in searchResponse.Items)
                {
                    NSPYouTube myVideo = new NSPYouTube();
                    myVideo.VideoId = searchResult.Id.VideoId;
                    myVideo.Title = searchResult.Snippet.Title;
                    myVideo.VideoImageUrl = searchResult.Snippet.Thumbnails.Default__.Url;
                    myRes.Add(myVideo);
                }
            }
            catch (Exception e1)
            {
                //TRAP THE EXCEPTION
                string appo = e1.Message;
            }
            return myRes;
        }

Come si può vedere i due metodi differiscono solamente nella definizione di un parametro della listRequest: nel primo caso valorizziamo il ChannelId, nel secondo caso valorizziamo il paramtro Q. Inoltre nel caso di canali ci facciamo restituire i dati ordinati per DATA (SearchResource.ListRequest.OrderEnum.Date), nel caso di ricerca ce li facciamo restituire ordinati per RATING (SearchResource.ListRequest.OrderEnum.Rating)


Visualizzare il video YouTube in un componente MediaElement
Una volta ottenuto il VideoId sarà sufficiente passarlo a questo metodo
        public async void Play(string myYouTubeId)
        {
            try
            {
                var url = await YouTube.GetVideoUriAsync(
                        myYouTubeId, YouTubeQuality.Quality720P);

                YouTubePlayer.Source = url.Uri;
                YouTubePlayer.Play();
            }
            catch (Exception exception)
            {
                // TODO show error (video uri not found)    
            }
        }

Dove YouTubePlayer è un oggetto di tipo MediaElement

TIP: recuperare il ChannelId a partire da un nome utente
Il ChannelId è un codice necessario per poter recuperare i video di un determinato canale. Il ChannelId è dato dal codice utente preceduto dalle lettere UC (User Channel).
Ci sono alcuni casi in cui, collegandoci al canale, visualizziamo l'url del tipo
https://www.youtube.com/user/NBA
In questo caso il codice del canale non è certo UCNBA...
Per recuperarlo si può usare una YouTube API direttamente da browser, anche qui usando la nostra KEY:

https://www.googleapis.com/youtube/v3/channels?key=XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX&forUsername=NBA&part=id

questa chiamata ci mostrerà nel browser il seguente risultato:

{
 "kind": "youtube#channelListResponse",
 "etag": "\"3WIcRE7IJ70nCYemJJIi1L7dYAg/mdOLeCC5TXroJeCUR_pHsiSfllk\"",
 "pageInfo": {
  "totalResults": 1,
  "resultsPerPage": 5
 },
 "items": [
  {
   "kind": "youtube#channel",
   "etag": "\"3WIcRE7IJ70nCYemJJIi1L7dYAg/b-WqXQKvRuvg8CDbLWHEggNmjIs\"",
   "id": "UCWJ2lWNubArHWmf3FIHbfcQ"
  }
 ]
}



Il valore del campo "id" è il codice del Channel che stiamo cercando

Notifiche