Lecteur YouTube API: Comment obtenir la durée d'un chargé/indicé vidéo sans jouer?

Je ne suis pas en mesure d'obtenir la bonne vidéo durée/durée (en secondes) d'un chargé/indicé la vidéo via le getDuration() la méthode du Lecteur YouTube API; la même méthode, mais renvoie une valeur valide une fois que la vidéo commence à jouer! Vous vous demandez comment YouTube est en mesure de démontrer la validité de la durée d'un chargé/indicé vidéo.

Lorsque je charge cette page HTML avec 15 secondes de vidéo clip, j'ai le débogage de sortie:

état = 5 durée = -0.000025

Quand j'appuie sur le bouton de lecture, j'ai le débogage de sortie:

état = 3 durée = 15,

Serait grandement apprécier une solution ou une solution de contournement. De chargement, et immédiatement de jouer et de la suspension du joueur serait pas ma méthode préférée.

<html>
<head>
<script type="text/javascript">
var videoId;
videoId = 'http://www.youtube.com/v/4TSJhIZmL0A';    //bbc
//videoId = 'http://www.youtube.com/v/ezwyHNs_W_A'; //physics
function $(id) {
return document.getElementById(id);
}
</script>
<script src="http://www.google.com/jsapi"></script>
<script>
google.load("swfobject", "2.1");
</script>
</head>
<body>
<table>
<tr><td>
<div id="player">
You need Flash player 8+ and JavaScript enabled to view this video.
</div>
<script>
var ytplayer;
function myOnPlayerStateChange(state) {
switch(state) {
case 1:  //playing
$("out").innerHTML += " playing";
break;
case 2:  //paused
$("out").innerHTML += " paused";
break;
case 0:  //ended
$("out").innerHTML += " ended";
break;      
case -1: //unstarted
case 3:  //buffering
case 5:  //cued
$("out").innerHTML += " state = " + state;
break;
default: //unknown
$("out").innerHTML += " state = " + state;
break;
}
$("out").innerHTML += " duration = " + ytplayer.getDuration() + ",";
}
function myOnPlayerError(errorCode) {
$("out").innerHTML += " Error occurred: " + errorCode;
}
function onYouTubePlayerReady(playerId) {
ytplayer = ytplayer || $(playerId);
ytplayer.addEventListener("onStateChange", "myOnPlayerStateChange");
ytplayer.addEventListener("onError", "myOnPlayerError");
}
var params = { allowScriptAccess: "always", bgcolor: "#cccccc" };
var atts = { };
swfobject.embedSWF(videoId + "?border=0&amp;enablejsapi=1&amp;playerapiid=" + 'player', 'player', 425, 344, "8", null, null, params, atts);
</script>
</td></tr>
</table>
<div id="out"></div>
<div id="err"></div>
</body>
</html>

Malheureusement, toutes les réponses ont été rendues obsolètes depuis Google désactivé V2 de l'API YouTube.

OriginalL'auteur Harry | 2010-01-18

17

Solution 1

Vous pouvez utiliser YouTube API de Données pour accéder à la plupart des informations à propos de la vidéo, y compris la durée:
```
<script type="text/javascript">
function youtubeFeedCallback(json){
document.write(json["data"]["duration"] + " second(s)");
}
</script>
<script type="text/javascript" src="http://gdata.youtube.com/feeds/api/videos/4TSJhIZmL0A?v=2&alt=jsonc&callback=youtubeFeedCallback&prettyprint=true"></script>
```
Démo ici

Lors de l'utilisation de jQuery, vous pouvez utiliser $.getJSON() pour rendre les choses plus facile.

Solution 2

Semble comme YouTube JavaScript API v3 vous permet d'obtenir le corriger durée à l'intérieur de la onYouTubePlayerReady() événement. Tout ce que vous devez faire est de passer &version=3 lors de l'appel de swfobject.embedSWF() méthode.

Démo ici

Votre solution 2 démo ne donne pas le bon terme ici. L'alerte affiche toujours 0. Cependant, quand je joue de la vidéo sur votre page de démonstration, fermer l'onglet et de le rouvrir, l'alerte t afficher la bonne durée.
en fait, je ne suis pas sûr moi-même. La documentation n'est pas claire quant à savoir si onYouTubePlayerReady est déclenché avant ou après les métadonnées est chargé. Vous pouvez essayer d'ajouter 2 secondes de retard.
Revisting mon ancien commentaire, il semble que de nos jours la solution 2 ne fonctionne pas. Il semble également fonctionner pour l'iframe API YouTube si vous définissez version=3 dans playerVars.
Hmm, malheureusement, getDuration() ne fonctionne que dans la solution 2, pour la première vidéo. Après repérage une autre vidéo, getDuration() appels peut retourner 0 nouveau. Exemple: jsfiddle.net/5p5sq
Malheureusement, l'utilisation de gdata.youtube.com peut être problématique parce que google Chrome bloque l'accès aux technologies de l'insécurité, de sorte que vous ne pouvez pas écrire un script, par exemple, ajouter la longueur de la vidéo de la page afin que les gens puissent voir la longueur, même si le Flash est désactivé ou réglé sur click-to-play. Et la deuxième (V3) méthode ne fonctionne pas sauf si la vidéo est en fait chargé. :-(

OriginalL'auteur Salman A

Suivant ces étapes:

1. Get youtube video id

2. Utiliser les API youtube pour obtenir la durée (ISO 8601 durée)

3. Convertir ISO 8601 durée de temps

À L'Aide De Jquery:

//convert ISO 8601 duration
function covtime(youtube_time){
array = youtube_time.match(/(\d+)(?=[MHS])/ig)||[]; 
var formatted = array.map(function(item){
if(item.length<2) return '0'+item;
return item;
}).join(':');
return formatted;
}
//print video duration
$('iframe').each(function(i) {
var ifr = $(this);
var regExp = /^.*(youtu\.be\/|v\/|u\/\w\/|embed\/|watch\?v=|\&v=)([^#\&\?]*).*/;
var match = ifr.attr('src').match(regExp);  //get youtube video id
if (match && match[2].length == 11) {
var youtubeUrl = "https://www.googleapis.com/youtube/v3/videos?id=" + match[2] 
+ "&key=AIzaSyDYwPzLevXauI-kTSVXTLroLyHEONuF9Rw&part=snippet,contentDetails";
$.ajax({
async: false,
type: 'GET',
url: youtubeUrl,
success: function(data) {
var youtube_time = data.items[0].contentDetails.duration;
var duration = covtime(youtube_time); 
if(ifr.next().is('.time')) {
ifr.next().html(duration);
}
}
});
}
});

Un grand merci 🙂

OriginalL'auteur Mr.Zon

"Chargement, et immédiatement de jouer et de la suspension du joueur serait pas ma méthode préférée."

Je ne pense pas qu'il y est toute autre méthode.

Dans mon cas ça fonctionne bien, même pour un satellite internet de l'utilisateur.

Voici mon code :

//I set youtube player-ready event to a variable for irrelevant reasons
function onYouTubePlayerReady(playerid) { 
youtube_player_ready;
}
youtube_player_ready = function(playerid) {
//load video
document.getElementById(playerid).cueVideoById(yt_video_id);
//mute video
document.getElementById(playerid).mute();
//play video to get meta data
document.getElementById(playerid).playVideo();
yt_get_duration[index] = function(){
//if duration is available
if (document.getElementById(playerid).getDuration() > 0) {
//pause video
document.getElementById(playerid).pauseVideo();
//unmute
document.getElementById(playerid).unMute();
//save duration
video_duration = document.getElementById(playerid).getDuration();
}
//else keep trying
else {
setTimeout(yt_get_duration[index], 150)
}
}
//get duration
yt_get_duration[index]();
}

OriginalL'auteur Wolf_Larsen

Ici un qui convertit plus de temps pour vous.

    <script type="text/javascript">
function youtubeFeedCallback(json){
var totalSec = json["data"]["duration"];
var hours = parseInt( totalSec / 3600 ) % 24;
var minutes = parseInt( totalSec / 60 ) % 60;
var seconds = totalSec % 60;
var result = (hours < 1 ? "" : hours + ":") + (minutes < 1 ? "0" : minutes) + ":" + (seconds  < 10 ? "0" + seconds : seconds);
document.write(result);
}
</script>
<script type="text/javascript" src="http://gdata.youtube.com/feeds/api/videos/LzPWWpKlvqQ?v=2&alt=jsonc&callback=youtubeFeedCallback&prettyprint=true"></script>

OriginalL'auteur LastEnd

À l'aide de jQuery

var youTubeURL = 'http://gdata.youtube.com/feeds/api/videos/oHg5SJYRHA0?v=2&alt=json';
var json = (function () {
$.ajax({
'async': false,
'global': false,
'url': youTubeURL,
'dataType': "jsonp", //necessary for IE9
crossDomain: true,
'success': function (data) {
var duration = data.entry.media$group.yt$duration.seconds;
}
});
})();

OriginalL'auteur mhenry1384

Vous devez vous connecter pour publier un commentaire.

Solution 1

Solution 2