Session Timeout Logout
From Logic Wiki
Simply I Added a parameter in web.config file This parameter keeps 10 minutes session time
<appSettings>
<add key="SessionTimeOut" value="10"/>
In master page I Add this on top of everything
Basically I check Time variable and if it's null it means nobody logged in yet. timer starts with the login as explained in last code block.
If Time has value I check it against current time and check the difference. If it's more then 10 minutes I remove session variable and send user to logout page (as logout page is doing propoer signouts)
Otherwise I refresh Time with current time
if (Session["Time"] != null)
{
if (DateTime.Now.Subtract(Convert.ToDateTime(Session["Time"])).Minutes > Convert.ToInt32(ConfigurationManager.AppSettings["SessionTimeOut"]))
{
Session.Remove("Time");
Response.Redirect("/signout");
}
else
{
Session["Time"] = DateTime.Now;
}
}
during login I create Time variable
Session["Time"] = DateTime.Now;
Single page sample
<!DOCTYPE html>
<html>
<head>
<style>
#TimeOutContainer {width:88%; height: 150px; display: none; position: fixed;margin-top: 5%; margin-left: 5%; background:#FFF; border: 1px solid #666;border: 1px solid #555;box-shadow: 2px 2px 40px #222; z-index: 999999;}
#TimeOutContainer iframe {display:none; width: 100%; height: 100%; position: absolute; border: none; }
#TimeOutBlock {background: #000; opacity:0.6; position: fixed; width: 100%; height: 100%; top:0; left:0; display:none;}
</style>
<script src="http://code.jquery.com/jquery-1.12.0.min.js"></script>
<title>Test JS</title>
<link href="style.css" type="text/css" media="all" rel="stylesheet"/>
</head>
<body>
<h1>Test</h1>
<p> This is a test page </p>
<p> <a href="other.html" target="_blank">Open in new window </a> </p>
<div id="TimeOutBlock"></div>
<div id="TimeOutContainer">
<div style="display:table;width:100%;height:100%;">
<div style="display:table-cell;vertical-align:middle;">
<div style="text-align:center;"><h3 id="TimeOutCountdown">Your session will be expired in 60 seconds</h3></div>
</div>
</div>
</div>
</body>
</html>
<script>
var timeOut = 60;
var warningTime = 30;
var consoleLog = false;
localStorage.setItem("MyTime", new Date().getTime());
$(document.body).bind("mousemove keypress", function(e) {
localStorage.setItem("MyTime", new Date().getTime());
});
function idleTime()
{
return parseInt((new Date().getTime() - localStorage.getItem("MyTime")) / 1000);
}
function refresh() {
if(idleTime() >= timeOut)
{
window.location.href="logout.html";
}else
{
if(idleTime() >= warningTime)
{
open();
$('#TimeOutCountdown').html("Your session will be expired in " + (timeOut - idleTime()) + " seconds");
}else
{
if(consoleLog == true)
{
console.log(idleTime());
}
close();
}
setTimeout(refresh, 1000);
}
}
setTimeout(refresh, 1000);
function open() {
$('#TimeOutBlock').fadeIn();
$('#TimeOutContainer').fadeIn();
}
function close() {
$('#TimeOutBlock').fadeOut();
$('#TimeOutContainer').fadeOut();
}
</script>