Ottieni la durata del video con l'API dei dati di YouTube?

Question

Fondamentalmente, sto cercando di ottenere la durata del video di ciascun video che compare nei risultati durante la ricerca. Ho creato un piccolo demo pronto per farti scherzare!

ANCHE - Quando dico durata intendo la durata del video in formato M/S (00:00) ..

DEMOhttp://codepen.io/mistkaes/pen/6b6a347c7d24edee15b3491420db4ecd

jQuery:

var apikey = '<API KEY>'; 

$(function() { 
    var searchField = $('#search-input'); 

    $('#search-form').submit(function(e) { 
     e.preventDefault(); 
    }); 
}); 

function search() { 
    $('#results').html(''); 

    q = $('#search-input').val(); 

    $.get(
     "https://www.googleapis.com/youtube/v3/search", { 
      part: 'snippet, id', 
      q: q, 
      maxResults: 50, 
      type: 'video', 
      key: apikey 
     }, 
     function(data) { 
      $.each(data.items, function(i, item) { 
       var output = getResults(item); 

       $('#results').append(output); 
      }); 
     }); 
} 

function getResults(item) { 
    var videoID = item.id.videoId; 
    var title = item.snippet.title; 
    var thumb = item.snippet.thumbnails.high.url; 
    var channelTitle = item.snippet.channelTitle; 

    var output = '<li>' + 
     '<div class="list-left">' + 
     '<img src="' + thumb + '">' + 
     '</div>' + 
     '<div class="list-right">' + 
     '<h3><a href="http://youtube.com/embed/' + videoID + '?rel=0">' + title + '</a></h3>' + 
     '<p class="cTitle">' + channelTitle + '</p>' + 
     '</div>' + 
     '</li>' + 
     '<div class="clearfix"></div>' + 
     ''; 

    return output; 
} 

Answer 1

Ho cercato la tua query e ho trovato che c'è un issue con l'API di ricerca.

L'alternativa è effettuare una chiamata alla risorsa video Youtube Data API's dopo aver effettuato la chiamata di ricerca. È possibile inserire fino a 50 video di id in cerca, in modo da non dover chiamare per ogni elemento

ho aggiornato il vostro codepen e quello che ho fatto è stata la seguente:

1) Get URL del ogni video che hai ottenuto dalla ricerca.

2) Inviare una un'altra chiamata Ajax per ottenere Durata: -

for (var i = 0; i < data.items.length; i++) { 
    var url1 = "https://www.googleapis.com/youtube/v3/videos?id=" + data.items[i].id.videoId + "&key=AIzaSyDYwPzLevXauI-kTSVXTLroLyHEONuF9Rw&part=snippet,contentDetails"; 
    $.ajax({ 
     async: false, 
     type: 'GET', 
     url: url1, 
     success: function(data) { 
      if (data.items.length > 0) { 
       var output = getResults(data.items[0]); 
       $('#results').append(output); 
      } 
     } 
    }); 
} 

3) L'API dare il tempo in formato ISO così ho convertito in formato mm:ss (come si voleva).

function convert_time(duration) { 
    var a = duration.match(/\d+/g); 

    if (duration.indexOf('M') >= 0 && duration.indexOf('H') == -1 && duration.indexOf('S') == -1) { 
     a = [0, a[0], 0]; 
    } 

    if (duration.indexOf('H') >= 0 && duration.indexOf('M') == -1) { 
     a = [a[0], 0, a[1]]; 
    } 
    if (duration.indexOf('H') >= 0 && duration.indexOf('M') == -1 && duration.indexOf('S') == -1) { 
     a = [a[0], 0, 0]; 
    } 

    duration = 0; 

    if (a.length == 3) { 
     duration = duration + parseInt(a[0]) * 3600; 
     duration = duration + parseInt(a[1]) * 60; 
     duration = duration + parseInt(a[2]); 
    } 

    if (a.length == 2) { 
     duration = duration + parseInt(a[0]) * 60; 
     duration = duration + parseInt(a[1]); 
    } 

    if (a.length == 1) { 
     duration = duration + parseInt(a[0]); 
    } 
    var h = Math.floor(duration/3600); 
    var m = Math.floor(duration % 3600/60); 
    var s = Math.floor(duration % 3600 % 60); 
    return ((h > 0 ? h + ":" + (m < 10 ? "0" : "") : "") + m + ":" + (s < 10 ? "0" : "") + s); 
} 

4) Appendi il risultato con il titolo del video.

'<p class="cTitle">' + channelTitle + ' --->' + duration + '</p>'