使用YouTube数据API获取视频时长？ [英] Get video duration with YouTube Data API?
问题描述
基本上，我想要获取搜索结果中显示的每个视频的视频时长。
另外 - 当我说duration时，我的意思是视频的长度为M / S格式（0： 00）..
DEMO http://codepen.io/mistkaes/pen/6b6a347c7d24edee15b3491420db4ecd
jQuery：
var apikey ='AIzaSyDYwPzLevXauI-kTSVXTLroLyHEONuF9Rw';
$（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）{
$。每个（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>'+
'';
返回输出;
}
使用搜索API存在问题。
另一种方法是调用 Youtube数据API的视频资源在您进行搜索调用后。您最多可以在搜索中添加50个视频ID，因此您不必为每个元素调用
。我更新了您的 codepen ，我所做的是以下内容：
1） 发送另一个Ajax调用以获取持续时间： -
for（var i = 0; i
$ .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） API以ISO格式所以我将它转换为 mm：ss 格式（如你所愿）。
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？ ：）+ s）;
}
4）视频。
'< p class =cTitle>'+ channelTitle +'---> +'< / p>'
Basically, I'm trying to get the video duration of each video that shows up in the results when they search. I have a neat little demo set up for you to mess with!
ALSO - When I say duration I mean the length of the video in M/S format (0:00)..
DEMO http://codepen.io/mistkaes/pen/6b6a347c7d24edee15b3491420db4ecd
jQuery:
var apikey = 'AIzaSyDYwPzLevXauI-kTSVXTLroLyHEONuF9Rw';
$(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;
}
I searched your query and found there's an issue with the search api.
The alternative is to make a call to the Youtube Data API's Video resource after you make the search call. You can put up to 50 video id's in search, so you won't have to call it for each element
I updated your codepen and what I done was the following:
1) Get Url of each video that you got from search.
2) Send an another Ajax call to get duration:-
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) The API give time in ISO format so I converted it into mm:ss format (as you wanted).
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) Append your result with title of your video.
'<p class="cTitle">' + channelTitle + ' --->' + duration + '</p>'
这篇关于使用YouTube数据API获取视频时长？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
