localStorage on javascript引领清爽

时间:2017-07-10 12:49:41

标签: javascript local-storage logout idle-timer

我试图在闲置时使用javascript跳出用户,下面的代码适用于多个标签的单个标签,但它无法正常工作

对于Eg:我将10秒设置为空闲时间并离开第一个选项卡,它会在10秒内抛出用户,假设我在 00:00:05 小时打开第一个选项卡并打开第二个标签位于 00:00:10 小时,并在 00:00:13 小时的第二个标签页上工作,并留下项目必须在 00上注销的标签:00:23 对吗?但它会在 00:00:15 注销,我不知道这里发生了什么,如果它没有正确刷新它怎么能长时间停留在第二个标签上我什么时候使用它?如果它正确刷新它怎么能根据第一个打开的选项卡登出我,代码如下。

<script>
var IDLE_TIMEOUT = 10; //seconds
localStorage.setItem("setTimeOut", "0");

document.onclick = function () {    
    localStorage.setItem("setTimeOut", "0");
};

document.onmousemove = function () {   
    localStorage.setItem("setTimeOut", "0");
};

document.onkeypress = function () {  
    localStorage.setItem("setTimeOut", "0");
};

document.onfocus = function () {  
    localStorage.setItem("setTimeOut", "0");
};


window.setInterval(CheckIdleTime, 1000);
function CheckIdleTime() {  
    localStorage.setItem("setTimeOut", parseInt(localStorage.getItem("setTimeOut"))+1);
    if (localStorage.getItem("setTimeOut") >= IDLE_TIMEOUT) {
        alert('Times up!, You are idle for about 15 minutes, Please login to continue');
        document.location.href = "logout.php";
    }
}
</script>

2 个答案:

答案 0 :(得分:1)

此行将每秒为您的应用的每个实例(标签)运行。这意味着如果你打开2个标签,那么它每秒递增2而不是1。

localStorage.setItem("setTimeOut", parseInt(localStorage.getItem("setTimeOut"))+1);

您可以使用用户注销时的特定时间而不是倒计时来解决此问题。

答案 1 :(得分:1)

不是每一个选项卡上每秒递增一次值,这意味着它会随着标签数量的增加而不是1秒而增加,只需在交互时设置当前时间,然后再与每秒进行比较。

因此,在您的事件处理程序中,请改为:

localStorage.setItem("lastInteraction", Date.now())

...然后在您的CheckIdleTime()功能中,移除localStorage.setItem()并将if条件更改为:

Number(localStorage.getItem("lastInteraction")) + (IDLE_TIMEOUT * 1000) < Date.now()

条件采用上次交互发生的时间,添加超时常量,然后检查当前时间(现在)是否已超过该值。