Ich habe ein Problem damit verwandte Videos als Thumbnails zu einem bestimmten Video abrufen. In meinem Code habe ich die search->list
richtig eingerichtet und gibt die verschiedenen Titel und Thumbnail URLs für die zugehörigen Videos zurück. Da search->list
jedoch keinen Parameter contentDetails
oder statistics
enthält, habe ich eine weitere Frage zu meinem exakt gleichen Problem here gefunden und einen zweiten Aufruf für videos->list
verwendet, da diese Parameter unterstützt werden, um die Dauer und die Anzahl der Aufrufe abrufen zu können. Aber das Problem ist, dass beide Werte (vidDuration
& viewCount
) nichts passieren und als undefined markiert werden, wie das Element durchlaufen und angehalten wird. Wie kann ich die duration
und viewCount
Werte des Artikels basierend auf search->list
's Artikel machen?Ähnliche Videos mit Teil contentDetails und Statistiken - Youtube API V3
script.js:
function relatedVids(videoId)
{
debugger;
$.get(// get related videos related to videoId - relatedToVideoId
"https://www.googleapis.com/youtube/v3/search",
{
part: 'snippet',
maxResults: vidResults,
relatedToVideoId: videoId, // $.cookie("id"); from single-video.html
type: 'video',
key: 'XXXXXXXXX'
},
function(data)
{
$.each(data.items,
function(i, item)
{
console.log(item);
var vidTitle = item.snippet.title; // video title
//var videoId = item.snippet.resourceId.videoId; // video id
//var vidDuration = item.contentDetails.duration;
//var viewCount = item.statistics.viewCount;
var vidThumbUrl = item.snippet.thumbnails.default.url; // video thumbnail url
var extractVideoId = null; // var to extract video id string from vidThumbUrl
// check if vidThumbUrl is not null, empty string, or undefined
if(vidThumbUrl)
{
//console.log("vidThumbUrl: ", vidThumbUrl);
var split = vidThumbUrl.split("/"); // split string when '/' seen
extractVideoId = split[4]; // retrieve the fourth index on the fourth '/'
//console.log("extractVideoId: ", extractVideoId); // YE7VzlLtp-4
//console.log("split array: ", split);
}
else console.error("vidThumbUrl is either undefined or null or empty string.");
// if video title is longer than 25 characters, insert the three-dotted ellipse
if(vidTitle.length > 25)
{
var strNewVidTitle = vidTitle.substr(0, 25) + "...";
vidTitle = strNewVidTitle;
}
// search->list only takes snippet, so to get duration and view count; have to call this function that has the recognized param structure
$.get(
"https://www.googleapis.com/youtube/v3/videos",
{
part: 'contentDetails, statistics',
id: extractVideoId, //item.snippet.resourceId.videoId,
key: 'XXXXXXXXX',
},
// return search->list item's duration and view count
function(item)
{
vidDuration = item.contentDetails.duration; // pass item's duration
return vidDuration;
},
function(item)
{
viewCount = item.statistics.viewCount; // pass item's view count
return viewCount;
}
);
try
{
var vidThumbnail = '<div class="video-thumbnail"><a class="thumb-link" href="single-video.html"><div class="video-overlay"><img src="imgs/video-play-button.png"/></div><img src="' + vidThumbUrl + '" alt="No Image Available." style="width:204px;height:128px"/></a><p><a class="thumb-link" href="single-video.html">' + vidTitle + '</a><br/>' + convert_time(vidDuration) + '/Views: ' + viewCount + '</p></div>';
// print results
$('.thumb-related').append(vidThumbnail);
}
catch(err)
{
console.error(err.message); // log error but continue operation
}
}
);
}
);
}
Einzel video.html Skript:
$(document).ready(function()
{
var videoId;
$(function()
{
if($.cookie("title") != null && $.cookie("id") != null)
{
var data = '<div class="video"><iframe height="' + vidHeight + '" width="' + vidWidth + '" src=\"//www.youtube.com/embed/' + $.cookie("id") + '\"></iframe></div><div class="title">' + $.cookie("title") + '</div><div class="desc">' + $.cookie("desc") + '</div><div class="duration">Length: ' + $.cookie("dur") + '</div><div class="stats">View Count: ' + $.cookie("views") + '</div>';
$("#video-display").html(data);
$("#tab1").html($.cookie("desc"));
videoId = $.cookie("id");
//vidDuration = $.cookie("dur"); works but prints out the same value for each
//viewCount = $.cookie("views"); works but prints out the same value for each
debugger;
relatedVids(videoId); // called here
console.log("from single-vid.html globalPlaylistId: ", $.cookie("playlistId"));
// remove cookies after transferring it to this page for display
$.removeCookie("title");
$.removeCookie("id");
$.removeCookie("desc");
$.removeCookie("views");
$.removeCookie("dur");
$.removeCookie("tags");
$.removeCookie("playlistId");
}
});
});
Haben Sie etwas dagegen, mir ein Beispiel in Codeform zu zeigen? Vielen Dank! – TheAmazingKnight
Ich habe meinen Code bearbeitet und einige Dinge verfeinert, wie zum Beispiel nur einen Parameter für die Funktion 'relatedVids (videoId)' und 'return' Schlüsselwort mit vidDuration und viewCount basierend auf dem, was Sie gesagt haben, aber aus irgendeinem Grund, der $ .get() 'Objekt von videoId zum Abrufen von' vidDuration' und 'viewCount' ist da, aber beide Werte haben immer noch nichts und bleiben null. – TheAmazingKnight
@TheAmazingKnight Du hast meinen Standpunkt nicht verstanden. Zu Beginn haben Sie die Callback-Funktion für die 'videos'-get-Anfrage keine Parameter, was bedeutet, dass Sie die zurückgegebene Antwort ignorieren. Also überarbeitete ich Ihren Code, um einen Parameter 'videoItem' an den Callback zu übergeben. –