检测浏览器是否有超过1个选项卡/窗口打开

Pat*_*ans 2 javascript browser tabs sandbox

所以我正在开发一个测验Web应用程序.我想添加一个测验管理员可以设置的设置,以便用户在测验时只能打开1个窗口/标签.

这样做的原因是为了让它们在测验窗口/标签打开时不能像谷歌一样转动并回答答案.当然,他们总是可以打开不同的浏览器并按照这种方式进行操作,但仍然认为让它们启用是一个很好的功能.

现在我不知道这是否属于安全沙箱违规(因此根本不可用),但因为我只想检测是否有另一个选项卡或窗口打开而没有得到关于选项卡/窗口的实际信息我希望这有点可能使用javascript.

aps*_*ers 9

您不能,但可能的解决方法是使用新的HTML5全屏API.您可以使用一个setInterval功能定期测试,document.fullScreen == true以确保用户没有切换到全屏.

这仅适用于现代浏览器,如果用户了解JS控制台的方式,那么解决这个问题很简单,但它确实符合您的要求.

请注意,所有全屏API实现目前都以供应商为前缀.


rai*_*7ow 6

对于下面描述的方法似乎有可行的替代方法:使用当前所有现代浏览器都支持的Page Visibility API.这听起来比听取的要可靠得多blur.有一种可行的方法:

// on quiz start
document.addEventListener('visibilitychange', function() {
  if (document.hidden) {
    console.log('Y U hide?');
  }
});
Run Code Online (Sandbox Code Playgroud)

问题是visibilitychange只有当页面从可见变为隐藏时才触发事件(反之亦然).它仍然允许用户打开两个浏览器实例 - 一个带有测验页面,一个带有任何喜爱的搜索引擎.


虽然您无法检测到打开的标签数量,但您可以尝试使用此技巧检查用户何时离开测验页面:

$(function(){
  $(window).blur(function() {
    console.log('I see what you did here!');
  });
});
Run Code Online (Sandbox Code Playgroud)

可悲的是,它也会给你很多误报.