在我的网页上设置超时会话时遇到问题

Question

我正在开发一个应用程序，如果用户在页面上未处于活动状态，则需要在一定时间后自行注销。我正在使用 azure 身份验证令牌，它会在一小时后过期。现在我正在尝试设置两个计时器，第一个计时器将运行每隔一分钟，并且会随着每次鼠标操作而不断自我重置，第二个计时器应该在 58 分钟不活动后加载，显示只有 120 秒保留在会话中。我无法获得所需的功能，第一个计时器在 1 分钟后运行s，但同时它也启动了第二个计时器。

这是我的 Javascript 代码..

<script>

    function timerModal() {
        var count = 120;
        console.log("This has started");
        var counter = setInterval(timer, 1000); //1000 will  run it every 1 second

        function timer() {

            count = count - 1;
            if (count <= 0) {

                $(this).mousemove(function (e) {
                    count = 120;
                });
                $(this).keypress(function (e) {
                    count = 120;
                });
                clearInterval(counter);
                //vmsWebUtils.signOut();  //counter ended, do something here
                return;
            }

            document.getElementById("timer").innerHTML = count + " "; // watch for spelling
            console.log(count);
        }


    }

    var idleTime = 0;

    $(document).ready(function () {
        //Increment the idle time counter every minute.

        var idleInterval = setInterval(timerIncrement, 60000); // 1 minute
        //Zero the idle timer on mouse movement.
        $(this).mousemove(function (e) {
            idleTime = 0;
        });
        $(this).keypress(function (e) {
            idleTime = 0;
        });
    });

    function timerIncrement() {
        idleTime = idleTime + 1;
        if (idleTime => 57) { // 57 minutes
            $("#sessionTimeout").show();
                 timerModal();
        }
        console.log(idleTime);
    }


</script>

Answer 1

我曾经需要为一个站点实现相同的效果，如果有帮助的话，这里是代码。（设置为立即显示提示以供测试）

$('input').keypress(function(e) {
    if (e.which == 13) {

        $(this).next('input').focus();
        e.preventDefault();
    }
 resetlogout();
});
$('textarea').keypress(function(e) {
 resetlogout();
});

var autolog1 = setTimeout("logmeoutmsg()", 1);
var autolog = setTimeout("logmeout()", 10000);

function logmeout() {
 window.location.href = "index.php?logout=1";
}

function logmeoutmsg() {
 $("#logoutmsg").show(); 
 var count=10;
 var counter=setInterval(timer, 1000); //1000 will  run it every 1 second
 timer();
 function timer()
 {
 $("#counterdown").html(count);
   count=count-1;
   if (count <= 0)
   {
   clearInterval(counter);
   return;
   } 

 }
}

function resetlogout() {
 clearTimeout(autolog1);
 clearTimeout(autolog);
 autolog1 = setTimeout("logmeoutmsg()", 1);
 autolog = setTimeout("logmeout()", 10000);
 $("#logoutmsg").hide(); 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="logoutmsg" style="display:none;position:fixed;left:50%;top:100px;margin-left:-400px;border:1px solid #2e2e2e;width:800px;background:#eedbba;padding:10px 0px;">
 <div style="width:760px;margin-left:20px;text-align:center;">
 You will be logged out in <div style="display:inline-block;" id="counterdown"></div> seconds.<br><input style="color:#0000ff;cursor:pointer;" type="button" onclick="resetlogout();" value="Cancel">
 <input style="color:#0000ff;cursor:pointer;" type="button" onclick="resetlogout();" value="Logout">
 </div>
</div>

Answer 2

我通过一些修改自行修复了它，这是修改后的代码！！工作得很好！！

<script>
    var idleTime = 0;
    var idleInterval = setInterval(timerIncrement, 60000); // 1 minute
        $(this).mousemove(function (e) {
            idleTime = 0;
        });
        $(this).keypress(function (e) {
            idleTime = 0;
        });

    function timerIncrement() {
        idleTime = idleTime + 1;
        console.log(idleTime);
        if (idleTime > 2) { // 57 minutes
            clearInterval(idleInterval);
            timerModal();
            console.log("hello");
        }
        console.log(idleTime);
   }

    function timerModal() {
        var count = 120;
        console.log("This has started");
        var counter = setInterval(timer, 1000); //1000 will  run it every 1 second
        function timer() {
            count = count - 1;
            if (count <= 0) {
                clearInterval(counter);

                vmsWebUtils.signOut();  //counter ended, do something here
                return;
            }
            document.getElementById("timer").innerHTML = count + " "; // watch for spelling
            console.log(count);
        }
    }

</script>

在我的网页上设置超时会话时遇到问题

Having issues setting up a timeout session on my webpage

javascript

timer

azure

setinterval

clearinterval