Depuis quelques jours/semaines maintenant, Google a déprécié la version 2 de son API Youtube, pour laisser pleinement place à la version 3. Petit tutoriel pour tester comment vérifier l’existence d’une vidéo sur Youtube avec jQuery et récupérer les données de cette dernière.
Précédemment nous avons vu comment valider l’existence d’une vidéo Youtube avec jQuery. Depuis la sortie de la version 3 de l’API Youtube par Google et la dépréciation de la version 2, le code du précédent article est maintenant désuet! Et oui, ça va vite le web!!! J’imagine que beaucoup d’entre vous doivent procéder à la migration de l’API V2 vers l’API V3. Vous avez besoin de récupérer des données (thumbnails, titre, auteur…) d’une vidéo Youtube? Nous allons donc revoir le code pour obtenir un résultat identique.
Prérequis
Avant de commencer à coder, une petite nouveauté est apparue. Contrairement à la version 2, il est maintenant obligatoire d’activer les API utilisées et fournir au minimum une clé utilisateur lorsque vous procédez à une requête vers l’API V3. Il faut donc :
-
- Vous rendre et vous connecter ou créer un compte si ce n’est pas déjà fait sur la console de google.
-
- Créez un nouveau Projet, que vous nommerez comme bon vous semble.
-
- Dans le menu de gauche cliquez sur « API et Authentification » puis sur « API ».
-
- Une liste de toutes les API mises à votre disposition par Google est alors disponible.
-
- Cliquez sur « Youtube Data API » puis sur le bouton bleu « Activer l’API ».
Votre API est maintenant active, ne vous reste plus qu’à créer une clef utilisateur :
-
- Toujours dans le menu de gauche cliquez sur « API et Authentification » puis sur « Identifiants ».
-
- Cliquez ensuite sur le bouton bleu « Créer un clé », ce qui aura pour effet de… créer une clé (génial!!!).
-
- Modifiez les référents autorisés selon votre environnement de développement. Le bouton se situe alors sous les information apparues lors de la création de la clé. Les référents sont les domaines autorisés à utiliser votre clé.
-
- Si vous travaillez en ligne, déclarez le domaine de votre site. Pour Rollingbox : *.rollingbox.com par exemple.
-
- Si vous travaillez en local, je vous suggère de supprimer tous les référents, il faudra toutefois penser à ajouter le domaine une fois la mise en ligne réalisée.
-
- Modifiez les référents autorisés selon votre environnement de développement. Le bouton se situe alors sous les information apparues lors de la création de la clé. Les référents sont les domaines autorisés à utiliser votre clé.
Il me semble maintenant que vous êtes prêts pour jouer avec l’API Youtube V3.
Code Source jQuery
/*--- DEBUT ---*/ //URL à récupérer depuis un input par exemple var url = 'https://www.youtube.com/watch?v=k1nujPD06Jc'; //On récupère les valeurs de l'URL dans un array var match = url.match(/(?:https?:/{2})?(?:w{3}.)?youtu(?:be)?.(?:com|be)(?:/watch?v=|/)([^s&]+)/); //On récupère l'identifiant de la vidéo video_id = match[1]; //On récupère les datas depuis l'API Youtube $.get('https://www.googleapis.com/youtube/v3/videos?key=AIzaSyBdMuJQlbzDhJs0Ujhvzx2ucsO30lcP0OQ', { id: video_id, part: 'snippet' }, function(result) { //on vérifie que la vidéo existe sur Youtube grâce à l'identifiant if(result.items[0].id) { console.log('LA VIDEO EXISTE :-)'); console.log(result.items[0]); } else { console.log('LA VIDEO N'EXISTE PAS :-('); } }, 'jsonp'); /*--- FIN ---*/
J’espère que ce petit bout de code vous aidera, surtout si vous êtes bloqué depuis la dépréciation de la V2.
N’hésitez pas à laisser des commentaires!
Partager la publication "YOUTUBE API V3 – Valider l’existence d’une vidéo et récupérer les données"