旨在使用YouTube API创建一个收藏/喜欢的按钮。当用户点击按钮时,视频将保存到用户的收藏/喜欢播放列表中。
就像你在自己的网站上实现Facebook喜欢按钮一样。
这是对我之前的问题所提出的Bertrand Martel绝佳解决方案的跟进问题。
此特定功能的工作代码为:
<!-- button 1 -->
<button type="submit" data-youtube-video-id="EH3gqI2NAiE" value="Watch Later" class="ma_youtube_watch_later" name="send">
<div class="ma_youtube_watch_later_text">Watch Later</div>
</button>
<!-- button 2 -->
<button type="submit" data-youtube-video-id="0EMmKIIF-zE" value="Watch Later" class="ma_youtube_watch_later" name="send">
<div class="ma_youtube_watch_later_text">Watch Later</div>
</button>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script>
// By Bertrand Martel: https://dev59.com/W1gQ5IYBdhLWcg3wl1F3#42561941
var OAUTH2_CLIENT_ID = '28993181493-c9o6hdll3di0ssvebfd4atf13edqfu9g.apps.googleusercontent.com';
var OAUTH2_SCOPES = [
'https://www.googleapis.com/auth/youtube'
];
var init = false;
var youtube_video_id = '';
var button = null;
googleApiClientReady = function() {
gapi.auth.init(function() {
window.setTimeout(checkAuth, 1);
});
}
function checkAuth() {
gapi.auth.authorize({
client_id: OAUTH2_CLIENT_ID,
scope: OAUTH2_SCOPES,
immediate: true
}, handleAuthResult);
}
// Handle the result of a gapi.auth.authorize() call.
function handleAuthResult(authResult) {
jQuery('.ma_youtube_watch_later').off('click');
jQuery('.ma_youtube_watch_later').click(function(e) {
button = this;
var youtube_video_id = jQuery(this).attr("data-youtube-video-id");
// Add a video ID specified in the form to the playlist.
function addVideoToPlaylist() {
//addToPlaylist(jQuery('#video-id').val());
addToPlaylist(youtube_video_id);
}
if (authResult && !authResult.error) {
addVideoToPlaylist();
} else {
init = true;
gapi.auth.authorize({
client_id: OAUTH2_CLIENT_ID,
scope: OAUTH2_SCOPES,
immediate: false
}, handleAuthResult);
}
return false;
});
if (authResult && !authResult.error) {
// Authorization was successful. Hide authorization prompts and show
// content that should be visible after authorization succeeds.
jQuery('.pre-auth').hide();
jQuery('.post-auth').show();
loadAPIClientInterfaces();
jQuery('#add_to_wl').click(function(e) {
button = this;
addVideoToPlaylist(self);
});
}
}
function loadAPIClientInterfaces() {
gapi.client.load('youtube', 'v3', function() {
if (init) {
init = false;
addVideoToPlaylist();
}
});
}
// Add a video to a playlist. The "startPos" and "endPos" values let you
// start and stop the video at specific times when the video is played as
// part of the playlist. However, these values are not set in this example.
function addToPlaylist(id, startPos, endPos) {
var details = {
videoId: id,
kind: 'youtube#video'
}
if (startPos != undefined) {
details['startAt'] = startPos;
}
if (endPos != undefined) {
details['endAt'] = endPos;
}
var request = gapi.client.youtube.playlistItems.insert({
part: 'snippet',
resource: {
snippet: {
playlistId: "WL",
resourceId: details
}
}
});
request.execute(function(response) {
console.log(response);
if (!response.code) {
//jQuery('#status').html('<pre>Succesfully added the video : ' + JSON.stringify(response.result) + '</pre>');
// change button text
$(button).text('Video added');
} else if (response.code == 409) {
//jQuery('#status').html('<p>Conflict : this video is already on your Watch Later playlist</p>');
// change button text
$(button).text('Already added');
} else if (response.code == 404) {
//jQuery('#status').html('<p>Not Found : this video hasnt been found</p>');
// change button text
$(button).text('Video not found');
} else {
//jQuery('#status').html('<p>Error : code ' + response.code + '</p>');
// change button text
$(button).text('Error: Try again');
}
});
}
</script>
<script src="https://apis.google.com/js/client.js?onload=googleApiClientReady"></script>
我们在API文档中有一些PHP代码示例。我们还有一些有关向播放列表添加视频的文档。
如何使用PHP和/或JavaScript实现这一目标?
data-type="WL, likes"
的数组,然后将视频添加到这些播放列表中。不确定YouTube是否会对此进行某种形式的阻止。 - Henrik PettersonplaylistId
字段,但它只考虑第一个项目)。您需要进行两次连续的播放列表插入调用。 - Bertrand Martelelse if (response.code == 409)
和其他类似的代码只适用于“WL”播放列表,而不适用于“favorites”和“likes”播放列表。因此,即使视频已添加到用户的收藏夹播放列表中,他们仍将看到$(button).val('Video added');
。您可以在自己的演示中轻松看到这个问题,只需两次点击喜欢或收藏即可...您有解决这个问题的方法吗?除了这个问题,这个答案真是太棒了。如果可以的话,我会加1000分! - Christine CooperplaylistItem.list
,请参见此处的示例。如果请求返回404,则视频不在播放列表中。 - Bertrand Martel