当用户在页面 javascript 或 php 中不活动 3 分钟时自动注销

Posted

技术标签:

【中文标题】当用户在页面 javascript 或 php 中不活动 3 分钟时自动注销【英文标题】:Automatically log out while user inactive for 3 minutes in a page javascript or php 【发布时间】:2018-06-21 17:41:31 【问题描述】:

我创建了一个选项卡 A、B、C。每个选项卡都有一个 html 页面。如果我单击第一个选项卡,我已经为自动注销设置了超时功能(javascript)。如果我单击第二个选项卡,则会运行相同的超时功能。但我想停止/重置第一个选项卡计时器。

function timeout()
	var IDLE_TIMEOUT = 60; //seconds
	var _idleSecondsTimer = null;
	var _idleSecondsCounter = 0;

	document.onclick = function() 
	    _idleSecondsCounter = 0;
	;

	document.onmousemove = function() 
	    _idleSecondsCounter = 0;
	;

	document.onkeypress = function() 
	    _idleSecondsCounter = 0;
	;

	_idleSecondsTimer = window.setInterval(CheckIdleTime, 1000);

	function CheckIdleTime() 
	     _idleSecondsCounter++;
	    
	    if (_idleSecondsCounter >= IDLE_TIMEOUT) 
	        window.clearInterval(_idleSecondsTimer);
	        alert("Time expired!");
	        document.location.href = "logout.php";
	    
	


function opentab1()
     document.getElementById("tab1").innerHTML='<object type="text/html" data="tab1.php" ></object>';


function opentab2()
     document.getElementById("tab2").innerHTML='<object type="text/html" data="tab2.php" ></object>';


function opentab3()
     document.getElementById("tab3").innerHTML='<object type="text/html" data="tab3.php" ></object>';

function opentab4()
     document.getElementById("tab4").innerHTML='<object type="text/html" data="tab4.php" ></object>';
<body>
<div class="tab1" onload="timeout()" onclick="opentab1()">
</div>
<div class="tab2"  onload="timeout()" onclick="opentab2()">
</div>
<div class="tab3"  onload="timeout()" onclick="opentab3()">
</div>
<div class="tab4"  onload="timeout()" onclick="opentab4()">
</div>

// loading an php file using on click function
<div class="container" id="tab1"></div>
<div class="container" id="tab2"></div>
<div class="container" id="tab3"></div>
<div class="container" id="tab4"></div>


</body>

提前致谢。请指导。

【问题讨论】:

试着把var _idleSecondsTimer = null放在timeout()函数的外面 【参考方案1】:

你可以使用 setTimeout()。

clearTimeout() 方法清除使用 setTimeout() 方法设置的计时器。

setTimeout() 返回的 ID 值作为 clearTimeout() 方法的参数。

注意:要能够使用 clearTimeout() 方法,必须在创建超时方法时使用全局变量:

Syntax:
    myVar = setTimeout("javascript function", milliseconds);

然后,如果该函数尚未执行,您将能够通过调用 clearTimeout() 方法来停止执行。

Example:

var myVar;

function myFunction() 
   myVar = setTimeout(function() alert("Hello"); , 3000);


function myStopFunction() 
    clearTimeout(myVar);



 In your case: 
  window.timeout1 = setTimeout(function() 
        _idleSecondsCounter++;
        if (_idleSecondsCounter >= IDLE_TIMEOUT) 
             window.clearInterval(_idleSecondsTimer);
             alert("Time expired!");
             document.location.href = "logout.php";
        
  , 1000);

 function stopTimeout1() 
        clearTimeout(window.timeout1);
 

【讨论】:

【参考方案2】:

您可以在单击新选项卡时停止计时器,方法是编辑您的方法并停止当前计时器然后启动新的计时器。

您可以从 div 中删除 onload

<div class="tab1" onload="timeout()" onclick="opentab1()">

<div class="tab1" onclick="opentab1()">

然后在您检索标签内容的函数中,例如opentab1() 像下面的函数一样编辑它们

function opentab2()
     //clear the previous timer
     clearInterval(interval_name);

     //start a new timer
     timeout();

     document.getElementById("tab2").innerHTML='<object type="text/html" data="tab2.php" ></object>';

【讨论】:

以上是关于当用户在页面 javascript 或 php 中不活动 3 分钟时自动注销的主要内容,如果未能解决你的问题,请参考以下文章

当数据在javascript codeigniter php中使用ajax成功功能时,如何禁用页面重新加载?

php Postback & Javascript:表单提交后页面刷新

Cloudflare IP 地理位置替代方案?在 Javascript 或 PHP 中?

当我在不使用 PHP 标头函数的情况下确认使用 Javascript 时,如何重定向到另一个 PHP 页面

将Javascript数组传递给PHP文件[重复]

如何创建表,在用户提交表单时填写行