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
- Registrate un account google (se già non ce l'avete), e collegatevi alla console degli sviluppatori, al link https://console.developers.google.com
- Selezionate il menu hamburger
- Selezionate la voce API Manager
- Selezionate la voce Credentials, e quindi il bottone Add Credentials, scegliendo l'opzione API Key
- Alla richiesta ulteriore del tipo di Key da creare, selezionare la voce Browser Key
- Finalmente potete creare la Key, dandogli un nome
- Una vola create, potete leggere la Key nell'elenco delle Key
- Scrivetevi questa Key perché andrà usata nel codice
Attività da fare su Visual Studio - Create un progetto di tipo Universal App
- 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
- E ora passiamo al codice. Per comodità ci creiamo una classe semplicissima che rappresenta il singolo video con le informazioni minime:
- VideoId - conterrà l'id del video YouTube (es: https://www.youtube.com/watch?v=tUhIA3pIHSQ )
- Title - conterrà il titolo del video
- 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
