我希望用户能够浏览我的网站only浏览器中的一个选项卡。如何才能做到这一点?我会使用 javascript 和 cookies 吗?
例如,我有一个网站:www.example.com- 我希望我的客户只能从一个浏览器的一个选项卡访问该网站。如果他们打开另一个选项卡并加载网站(或网站的子页面) - 我想要一个警报“无法打开多个实例”,然后将它们重定向到错误页面。
需要注意的一件事 - 如果用户更改地址www.example.com/action/door/mine.aspx to www.example.com- 这应该可以正常工作,因为用户位于相同的(原始)选项卡中。
任何帮助将不胜感激。提前致谢。
我为此创建了一个简单的解决方案。母版页布局创建选项卡 GUID 并将其存储在选项卡的 sessionStorage 区域中。在存储区域上使用事件侦听器,我将选项卡 GUID 写入站点本地存储区域。然后,侦听器将选项卡 GUID 与写入站点存储的 GUID 进行比较,如果它们不同,则侦听器知道打开了多个选项卡。
因此,如果我有三个选项卡 A、B、C,然后单击选项卡 C 中的某些内容,选项卡 A 和 B 会检测到另一个选项卡已打开并警告用户。我还没有修复它,所以最后一个选项卡使用了获取通知,正在进行中。
这是我在母版页中的 JS,另外在登录页面中我有一个localStorage.Clear
清除上一个会话中的最后一个选项卡。
// multi tab detection
function register_tab_GUID() {
// detect local storage available
if (typeof (Storage) !== "undefined") {
// get (set if not) tab GUID and store in tab session
if (sessionStorage["tabGUID"] == null) sessionStorage["tabGUID"] = tab_GUID();
var guid = sessionStorage["tabGUID"];
// add eventlistener to local storage
window.addEventListener("storage", storage_Handler, false);
// set tab GUID in local storage
localStorage["tabGUID"] = guid;
}
}
function storage_Handler(e) {
// if tabGUID does not match then more than one tab and GUID
if (e.key == 'tabGUID') {
if (e.oldValue != e.newValue) tab_Warning();
}
}
function tab_GUID() {
function s4() {
return Math.floor((1 + Math.random()) * 0x10000)
.toString(16)
.substring(1);
}
return s4() + s4() + '-' + s4() + '-' + s4() + '-' +
s4() + '-' + s4() + s4() + s4();
}
function tab_Warning() {
alert("Another tab is open!");
}
注:IE9+
希望这可以帮助。
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)