动态YouTube视频页面-获取当前的视频ID和标题

时间:2019-03-05 11:00:24

标签: javascript youtube youtube-api

我正在使用iFrame API加载YouTube视频。

我在布局中有多个div,如下所示:

<div id="BS3w09zFZ_Y" class="embed-responsive-item youtube-video" data-id="BS3w09zFZ_Y"></div>
<div id="Xij2kX4uumM" class="embed-responsive-item youtube-video" data-id="Xij2kX4uumM"></div>

在我的JavaScript中,我有以下内容:

var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

function onYouTubeIframeAPIReady()
{
    //YouTube Videos....
    $('.youtube-video').each(function(i, obj)
    {
        var video_id = $(this).data('id');
        playerInfoList.push(
                {
                    id: video_id,
                    videoId: video_id
                }
        );
    });

    for (var i = 0; i < playerInfoList.length; i++)
    {
        curplayer = createPlayer(playerInfoList[i]);
        players[i] = curplayer;
    }
}

function createPlayer(playerInfo)
{
    return new YT.Player(playerInfo.id, {
        height: playerInfo.height,
        width: playerInfo.width,
        videoId: playerInfo.videoId,
        events: {
            'onStateChange': onPlayerStateChange
        }
    });
}

// when video ends
function onPlayerStateChange(event)
{
    // var video_data = curplayer.getVideoData();
    // vid_id = video_data.video_id;
    // var video_title = video_data.title;

    console.log(curplayer.getVideoData());

    if(event.data === 0)
    {
        // Video Finished...
        // Post Via AJAX..
        $.ajax(
                {
                    type: 'POST',
                    url: '/video/mark-watched',
                    data : { _token: token, video_clip_id: vid_id, video_title: video_title, video_section: section, section_id: section_id },
                    success: function( data )
                    {
                        // Do Nothing...
                    }
                }
        )
    }
    if (event.data == YT.PlayerState.PLAYING)
    {
        // Video Playing (Left for Reference)....
    }
}

我遇到的问题是,当我执行AJAX保存时,它正在将最后一个视频ID保存在该数组中:Xij2kX4uumM

他们可以通过任何方式获取当前播放的视频和标题吗?

谢谢。

0 个答案:

没有答案