使用 YouTube 数据 API 获取视频时长?
Get video duration with YouTube Data API?
基本上,我正在尝试获取搜索结果中显示的每个视频的视频时长。我设置了一个简洁的小演示供您使用!
另外 - 当我说持续时间时,我指的是 M/S 格式的视频长度 (0:00)..
演示 http://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;
}
我搜索了您的查询,发现有一个 issue 与搜索 api。
另一种方法是在进行搜索调用后调用 Youtube Data API's 视频资源。您最多可以在搜索中放置 50 个视频 ID,因此您不必为每个元素都调用它
我更新了您的 codepen,我所做的如下:
1) 获取您从搜索中获得的每个视频的 Url。
2) 发送另一个 Ajax 调用以获取持续时间:-
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) 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 ? "0" : "") + s);
}
4) 在结果中附加视频标题。
'<p class="cTitle">' + channelTitle + ' --->' + duration + '</p>'
基本上,我正在尝试获取搜索结果中显示的每个视频的视频时长。我设置了一个简洁的小演示供您使用!
另外 - 当我说持续时间时,我指的是 M/S 格式的视频长度 (0:00)..
演示 http://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;
}
我搜索了您的查询,发现有一个 issue 与搜索 api。
另一种方法是在进行搜索调用后调用 Youtube Data API's 视频资源。您最多可以在搜索中放置 50 个视频 ID,因此您不必为每个元素都调用它
我更新了您的 codepen,我所做的如下:
1) 获取您从搜索中获得的每个视频的 Url。
2) 发送另一个 Ajax 调用以获取持续时间:-
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) 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 ? "0" : "") + s);
}
4) 在结果中附加视频标题。
'<p class="cTitle">' + channelTitle + ' --->' + duration + '</p>'