如何限制用户在执行任务时在浏览器中打开多个选项卡？

Question

出于安全目的（例如银行），我必须限制用户打开任何浏览器的多个标签。 我希望用户仅在浏览器的单个选项卡中执行他们的任务。

如果他们尝试打开多个选项卡，则必须强制注销他们的用户 ID。

我不知道该怎么做。

请帮助我或提供一些逻辑来执行此操作。

提前致谢。

Answer 1

首先，我必须同意其他用户的意见——如果有人打开多个标签是一个安全问题，那么你就有问题了。大问题。

但是，如果您仍然真的想这样做：

当用户登录时：

// Must be a string
var dateTimeStamp = "" +new Date().getTime();

// This one can be seen by all windows/tabs
localStorage.setItem("timeKey", dateTimeStamp);
// This one can only be seen by the current window/tab
sessionStorage.setItem("timeKey", dateTimeStamp);

现在，当页面加载时，只需检查这两个值是否匹配：

var localKey = localStorage.getItem("timeKey");
var sessionKey = sessionStorage.getItem("timeKey");

// If there is a key:
if (localKey) {
  if (localKey !== sessionKey) {
    // Handle multiple login here? Redirect to login page?
    // Complain about tab?
  }
}

然后，当用户注销时，请确保您删除了这两个密钥。

localStorage.removeItem("timeKey");
sessionStorage.removeItem("timeKey");

警告：

这种编码有点脆弱，毫无疑问我错过了一个边缘情况。

额外积分

可以监视对localStorage 的更改，并在有人在新标签页上登录时强制所有其他页面注销。