计算使用API观看youtube视频的百分比

Calculate percentage of youtube video viewed with API

本文关键字:百分比 视频 youtube API 观看 计算使用      更新时间:2023-09-26

我正在制作一个视频和在线练习的在线课程,希望人们能够登录并跟踪他们的进度。

有没有办法衡量某人观看过的youtube嵌入的百分比,如果他们观看过,比如说超过80%,就标记为完整?

到目前为止,我最好的想法是当玩家的状态变为正在玩时使用getCurrentTime(),然后每隔五秒左右再使用一次,将差异添加到某种总数中。然而,如果有人看了五次第一分钟,他们最终会得到一个勾选的视频,尽管他们没有看完整的视频。

有没有比上面计算观看视频时间的方法更优雅的解决方案来计算观看视频的百分比?

这样的东西怎么样:

        var i; //Global variable so that you can reset interval easily
        function onYouTubePlayerReady(playerid) 
        {
            ytp = document.getElementById("ytvideo"); //get player on page
            ytp.d = ytp.getDuration(); //get video duration
            i = setInterval(checkPlayer, 5000); //check status
        }
        function onplayerReset() 
        {
            clearInterval(i);
        }
        function checkPlayer()
        {
            var p = ytp.getCurrentTime(); //get video position
            var d = ytp.d; //get video duration
            var c = p/d*100; //calculate % complete
            c = Math.round(c); //round to a whole number
            var t = document.getElementById('videotitle').innerHTML;
            if(ytp.isReset) { c = 0; }
            ytp.c=c;
            if(!ytp.completed) 
            {   
               if(c>=80) { _gaq.push(['_trackEvent', 'Video Status', t,'Complete']); ytp.completed=true; } // or do something else
            }
         }

我正在使用AngularJS的Angular YouTube嵌入模块(可在此处找到https://github.com/brandly/angular-youtube-embed)。但是这个解决方案对于纯Javascript/Uube API调用也是一样的。我只是不想重写我的解决方案。

基本概念是将整个视频长度分割成任意大小的片段。在这个示例解决方案中,我将视频分割为一系列10秒的切片。每隔5秒,计时器就会检查与其切片对应的播放器中的当前时间。重要的是,要比每个切片所代表的长度更频繁地进行测试。

无论用户是否跳到视频的末尾,getPctCompleted()方法都会给出视频总长度的完成比例。

但是,一个高级用户总是能够欺骗这一点。所以这并不能"证明"有人看了什么。它是不可信的输入,就像来自用户的任何其他输入一样。

       $scope.analyzer = {};
       $scope.timeElapsed = 0;
       $scope.videoLength = 0;
       $scope.$on('youtube.player.playing', function($event, player) {
           $scope.videoLength = player.getDuration();
           $scope.player = player;
           //start polling
           setInterval(function() {
                $scope.timeElapsed = $scope.player.getCurrentTime();
                $scope.analyzer[parseInt($scope.timeElapsed / 10)] = true;
                $scope.$apply();
           }, 5000);
       });
       $scope.getPctCompleted = function() {
           return Object.keys($scope.analyzer).length / (parseInt($scope.videoLength / 10));
       };