我教一门在线课程,我需要确保我的学生确实观看了某个视频。现在,我明白一切都可能被击败,但我正在寻找的是 80/20 规则,即我可以做一些调整,开始为我的学生负责的旅程。
Q1:如果当前窗口失去焦点,有没有办法通过 JavaScript 触发事件?
Q2:有没有办法在视频播放完毕时触发事件?
Q3:有没有办法确保视频一直播放,而不是学生点击时间线的末尾?
我觉得不得不说(再次),请不要用“你在浪费时间,学生会打败你所做的任何事情”之类的方式来回答这个问题。
我教一门在线课程,我需要确保我的学生确实观看了某个视频。现在,我明白一切都可能被击败,但我正在寻找的是 80/20 规则,即我可以做一些调整,开始为我的学生负责的旅程。
Q1:如果当前窗口失去焦点,有没有办法通过 JavaScript 触发事件?
Q2:有没有办法在视频播放完毕时触发事件?
Q3:有没有办法确保视频一直播放,而不是学生点击时间线的末尾?
我觉得不得不说(再次),请不要用“你在浪费时间,学生会打败你所做的任何事情”之类的方式来回答这个问题。
你用的是什么播放器。如果您使用的是 JWPlayer 或 Flow Player 等开源视频播放器。您可以跟踪事件。我个人更喜欢流播放器,您可以使用谷歌分析来跟踪页面上您想要的持续时间和任何其他任务。
由于您在页面上有身份验证机制,因此您可以获得学生的用户名(或标识符)。将此事件作为标签推送到谷歌分析,您可以跟踪学生所做的每一件事,包括他点击的链接、播放内容的持续时间、他播放的时间......
示例设置
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', '#########']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
追踪
_gaq.push(['_trackEvent', 'Videos', 'Play', 'Gone With the Wind']);
这是我从http://vsp.ideawide.com/获取的实时代码的一部分,我在其中跟踪了其中一些事件。
var events = {
clip : {
onStart: function(clip) {
_gaq.push(['_trackEvent',"Videos", "Play", defaults.source]);
},
onPause: function(clip) {
_gaq.push(['_trackEvent',"Videos", "Pause", defaults.source, parseInt(this.getTime())]);
},
onResume: function(clip) {
_gaq.push(['_trackEvent',"Videos", "Resume", defaults.source, parseInt(this.getTime())]);
},
onSeek: function(clip) {
_gaq.push(['_trackEvent',"Videos", "Seek", defaults.source ]);
},
onStop: function(clip) {
_gaq.push(['_trackEvent',"Videos", "Stop", defaults.source, parseInt(this.getTime())]);
},
onFinish: function(clip) {
_gaq.push(['_trackEvent',"Videos", "Finish", defaults.source]);
}
},
onFullscreen: function() {
_gaq.push(['_trackEvent',"Videos", "Full Screen", defaults.source]);
},
onError: function(errorCode , errorMessage) {
_gaq.push(['_trackEvent',"Videos", "Error", defaults.source, errorCode ]);
}
}
作为最后一点,使用合适的球员进行正确的分析设置,您可以将您的 80/20 提高到 99/1。
这是假设使用 video 标签的 HTML5 视频。
player = document.getElementById("player");
//Get current percent complete. You may want to check for 95%+ rather than 100%.
setInterval(function(){
percentComplete = player.currentTime/player.duration;
}, 300);
window.onblur = function() {
//this will be called when the window loses focus
};
您可以调用没有控件属性的视频标签来禁用搜索栏。然后,您可以使用以下方法触发点击播放:
player.play();
初始方法的问题
我教一门在线课程,我需要确保我的学生确实观看了某个视频。
这就是问题所在。您的要求是学生实际观看视频,但我们能以编程方式做的最好的事情是确保视频由服务器发送并由客户端接收。除了使用面部识别和音频环回等极端措施外,您无法确定是否有人在观看,或者目标观众正在观看,或者有人在听。学生可以简单地开始播放视频并走开。
这听起来像是一种技术性,但实际上这是一个重要的区别。您所拥有的相当于一个旨在确保有人阅读一本书的系统,但该系统所能做的就是检查该书在任何给定时间是打开还是关闭。
安全
现在,我明白一切都可能被击败,但我正在寻找的是 80/20 规则,即我可以做一些调整,开始为我的学生负责的旅程。
任何事情都可以通过足够的努力被击败,但建议的解决方案几乎可以毫不费力地被击败。如果您的普通用户欺骗系统比合法使用它更容易,那么它可能不值得实施。
另一种方法
与其关注浏览器是否正在播放视频,不如考虑将焦点转移回用户身上。通过在显示视频时要求一些特定的用户交互,您将能够对系统有更高的信心。
最简单的方法是将视频分成几个小部分,在每个播放后显示一个指向下一个视频的链接。
然后,您可以编写一个小脚本来显示对该系列视频(每个用户)的请求之间的时间,并根据片段的长度标记任何相距太远或太近的请求(或者与平均值进行比较,如果由于某种原因数据不可用)。如果您有权访问这些数据,则可以直接从服务器日志中提取这些数据,或者您可以自己记录。
理解
如果您想采取额外的步骤并测试理解(或保留),这种替代方法很容易扩展。与其有一个指向下一个视频的链接,不如有几个指向它的链接,以问题答案的形式。如果您担心学生分享答案,请不要告诉他们是否正确,只需将他们发送到下一个视频即可。您可以稍后查看此数据并决定是否要使用它以及如何弯曲它。
Q1:寻找事件 onblur
Q2:这取决于你的球员。有 Flash 视频播放器,您可以使用 ExternalInterface.call("myFunctionName()"); 调用 javascript 函数;来自 AS3
Q3:我会尝试找到一个具有所有选项的 Flash 播放器,但我的解决方案更多的是 as3 到 javascript。
我希望这可以帮助你!
也许为视频的长度做一个 setTimeout 并在视频的长度过去后触发一个事件。
试试这个来检测窗口何时失去焦点:
window.onblur = function() {
//do something here...
};
如果你真的担心 setTimeout 的准确性,不妨试试这个:
var start = (new Date).getTime();
function CheckTime() {
var diff = (new Date).getTime() - start;
if (diff >= videoLength) {
FireVideoDoneEvent();
}
else {
setTimeout(function() {
CheckTime();
}, 1000);
}
}