JavaScript上的localStorage导致刷新 [英] localStorage on javascript leads refreshing

问题描述

我正在尝试在闲置状态下用JavaScript触发用户，在各个标签之间使用javascript，下面的代码对于单个标签正常工作，对于多个标签则无法正常工作

I am trying to fire out the user when idle, using javascript across tabs, the below code working fine for single tab for multiple tab it is not working properly

例如:我将10秒钟设置为空闲时间，并在10秒内离开了第一个标签页，它将用户扔出去，假设我在 00:00:05 小时打开了第一个标签页并打开了第二个选项卡在 00:00:10 小时运行，第二个选项卡在 00:00:13 小时工作，并且两个选项卡都退出了项目，必须在 00退出:00:23 对吗?但它在 00:00:15 上注销，我不知道这里发生了什么，如果刷新不正确，当我使用它时如何在第二个选项卡上停留很长时间?如果刷新正确，如何根据第一个打开的选项卡和以下代码注销我.

For Eg: I have set 10 secs as idle time and left the first tab it throws out the user on 10 seconds, assume i opened the first tab at 00:00:05 hours and opened second tab at 00:00:10 hours and working on second tab for 00:00:13 hours and left both the tabs the project have to logout on 00:00:23 right? but it logs out on 00:00:15, I don't know whats happening right here, if it was not refreshing properly how could it stay on second tab for a long time when i am using it? if it is refreshing properly how could it log me out based on first opened tab, and the code as follows.

<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>

推荐答案

与其在每个标签上每秒增加该值，这意味着它会随着打开的标签数而不是1秒而每秒钟增加一次，只需设置当前的互动时间，然后每秒进行比较.

Instead of incrementing the value each second on each tab, which means every second it will be increased with the number of tabs open rather than 1 second, simply set the current time on interaction and then compare to that every second.

因此，请在事件处理程序中执行以下操作:

So, in your event handlers, do this instead:

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

...，然后在您的CheckIdleTime()函数中，删除localStorage.setItem()并将您的if条件更改为此:

... and then in your CheckIdleTime() function, remove the localStorage.setItem() and change your if condition to this:

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

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

The condition takes the time when the last interaction occurred, adds the timeout constant and then checks if the current time (now) has passed that value.

这篇关于JavaScript上的localStorage导致刷新的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！