我正在尝试在video:list api下为每个视频检索duration
和viewCount
的值。我创建了一个单独的函数,该函数将返回每个视频的时长和统计信息。唯一有效的方法是在videoId
函数中检索到的视频的播放列表和getPlaylist(...)
。我登录到控制台,这就是我得到的:
console.log("id: " + videoId + " duration: " + vidDuration + " viewCount: " + viewCount); // return value in console
id: xxx duration: undefined viewCount: undefined
我一直没有工作时间,但我注意到带有
part: statistics
的api将从注释掉的通道中检索视图总数的值。但这不是我想要的。我希望它与每个视频一起使用:GET https://www.googleapis.com/youtube/v3/videos
但是由于某种原因,我无法使其正常工作。我具有
videoId
属性并作为参数,因此playlistId可以读取它并检索视频的持续时间和观看次数的所述值,但是即使定义了videoId
,它仍然保持未定义状态。哦,警报对话框也没有出现。我在这里想念什么?
脚本:
var channelName = 'ExampleChannel';
var vidWidth = 500;
var vidHeight = 400;
var vidResults = 15; /* # of videos to show at once - max 50 */
var vidDuration = "";
var viewCount = 0;
var videoId = "";
$(document).ready(function() {
$.get( // get channel name and load data
"https://www.googleapis.com/youtube/v3/channels",
{
part: 'contentDetails',
forUsername: channelName,
key: 'XXXXXXXXXX'
},
function(data)
{
$.each(data.items,
function(i, item) {
console.log(item); // log all items to console
var playlistId = item.contentDetails.relatedPlaylists.uploads;
//var viewCount = console.log(item.statistics.viewCount);
getPlaylists(playlistId);
})
}
);
// function that gets the playlists
function getPlaylists(playlistId)
{
$.get(
"https://www.googleapis.com/youtube/v3/playlistItems",
{
part: 'snippet',
maxResults: vidResults,
playlistId: playlistId,
key: 'XXXXXXXXXX'
},
// print the results
function(data)
{
var output;
$.each(data.items,
function(i, item) {
console.log(item);
var vidTitle = item.snippet.title; // video title
var vidDesc = item.snippet.description; // video description
var videoId = item.snippet.resourceId.videoId; // video id
// check if description is empty
if(vidDesc == null || vidDesc == "")
{
vidDesc = "No description was written."; // FIX: test msg to see where it still shows up
$('#desc').remove(); // remove video description
}
else vidDesc = item.snippet.description;
vidDuration = getVideoDuration(videoId);
viewCount = getViewCount(videoId);
console.log("id: " + videoId + " duration: " + vidDuration + " viewCount: " + viewCount); // return value in console
output = '<li><iframe height="' + vidHeight + '" width="' + vidWidth + '" src=\"//www.youtube.com/embed/' + videoId + '\"></iframe></li><div id="title">' + vidTitle + '</div><div id="desc">' + vidDesc + '</div><div id="duration">Length: ' + vidDuration + '</div><div id="stats">View Count: ' + viewCount + '</div>';
// Append results to list tag
$('#results').append(output);
})
}
);
}
// return video duration
function getVideoDuration(videoId)
{
$.get(
"https://www.googleapis.com/youtube/v3/videos",
{
part: 'contentDetails',
id: videoId,
key: 'XXXXXXXXXX',
},
function(data)
{
$.each(data.items,
function(i, item) {
//videoId = item.snippet.resourceId.videoId;
alert(item.contentDetails.duration); // video duration
//alert(videoId);
})
}
);
}
// return video view count
function getViewCount(videoId)
{
$.get(
"https://www.googleapis.com/youtube/v3/videos",
{
part: 'contentDetails, statistics',
id: videoId,
key: 'XXXXXXXXXX',
},
function(data)
{
$.each(data.items,
function(i, item) {
//videoId = item.snippet.resourceId.videoId;
alert(item.statistics.viewCount); // view count
//alert(videoId);
})
}
);
}
});
截图:(更新)
最佳答案
因为当您调用这些函数时,您不必等待该函数完成。
您需要在Javascript中使用Promise。
我对您的代码做了一些更改(已通过我的api密钥进行了测试)
var channelName = 'example';
var vidWidth = 500;
var vidHeight = 400;
var vidResults = 15; /* # of videos to show at once - max 50 */
var vidDuration = "";
var viewCount = 0;
var videoId = "";
$(document).ready(function() {
$.get( // get channel name and load data
"https://www.googleapis.com/youtube/v3/channels",
{
part: 'contentDetails',
forUsername: channelName,
key: 'xxx'
},
function(data)
{
$.each(data.items,
function(i, item) {
//console.log(item); // log all items to console
var playlistId = item.contentDetails.relatedPlaylists.uploads;
//var viewCount = console.log(item.statistics.viewCount);
getPlaylists(playlistId);
});
}
);
// function that gets the playlists
function getPlaylists(playlistId)
{
$.get(
"https://www.googleapis.com/youtube/v3/playlistItems",
{
part: 'snippet',
maxResults: vidResults,
playlistId: playlistId,
key: 'xxx'
},
// print the results
function(data)
{
var output;
$.each(data.items,
function(i, item) {
console.log(item);
var vidTitle = item.snippet.title; // video title
var vidDesc = item.snippet.description; // video description
var videoId = item.snippet.resourceId.videoId; // video id
// check if description is empty
if(vidDesc == null || vidDesc == "")
{
vidDesc = "No description was written."; // FIX: test msg to see where it still shows up
$('#desc').remove(); // remove video description
}
else vidDesc = item.snippet.description;
getVideoDuration(videoId).done(function(d, v){
vidDuration = d;
//console.log(r);
viewCount = v;
document.write("id: " + videoId + " duration: " + vidDuration + " viewCount: " + viewCount); // return value in console
document.write("<br>");
output = '<li><iframe height="' + vidHeight + '" width="' + vidWidth + '" src=\"//www.youtube.com/embed/' + videoId + '\"></iframe></li><div id="title">' + vidTitle + '</div><div id="desc">' + vidDesc + '</div><div id="duration">Length: ' + vidDuration + '</div><div id="stats">View Count: ' + viewCount + '</div>';
// Append results to list tag
$('#results').append(output);
});
});
}
);
}
// return video duration
function getVideoDuration(videoId)
{
var dfrd1 = $.Deferred();
var r = '';
$.get(
"https://www.googleapis.com/youtube/v3/videos",
{
part: 'contentDetails',
id: videoId,
key: 'xxx',
},
function(data)
{
$.each(data.items,
function(i, item) {
//videoId = item.snippet.resourceId.videoId;
var view = 0;
r = item.contentDetails.duration; // video duration
getViewCount(videoId).done(function(t){
view = t;
dfrd1.resolve(r, view);
});
//alert(videoId);
});
}
);
return dfrd1.promise();
}
// return video view count
function getViewCount(videoId)
{
var dfrd2 = $.Deferred();
var r = '';
$.get(
"https://www.googleapis.com/youtube/v3/videos",
{
part: 'contentDetails, statistics',
id: videoId,
key: 'xxx',
},
function(data)
{
$.each(data.items,
function(i, item) {
//videoId = item.snippet.resourceId.videoId;
r = item.statistics.viewCount; // view count
//alert(videoId);
dfrd2.resolve(r);
// console.log("in", r);
});
}
);
return dfrd2.promise();
}
});
编辑
换句话说,这是一个异步方法调用。
getVideoDuration(videoId).done(function(r)
说明:
调用函数
getVideoDuration
和.done
告诉我们,函数getVideoDuration
将在我们解决承诺(dfrd1.resolve(r);
)时返回结果。同时,函数return dfrd1.promise();
表示将推迟结果。兑现诺言后,我们输入
done
,其余的我们就可以完成:)您在屏幕快照上看到的是合乎逻辑的,因为有两个Promise!
我的错误是我没有看到重复的输入行。
我更改代码以解决此问题。
因此,第一个功能
getVideoDuration
将被解析,第二个功能将被解析。解析第二个函数后,我们解析第一个将结果发送给函数getPlaylists(playlistId)
的承诺。编辑25/02
我更改有关承诺错误的代码。
关于javascript - Youtube API v3的contentDetails,持续时间和统计信息存在问题,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/35511630/