Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Inactivity timeout javascript
<script type="text/javascript">
function idleTimer() {
var t;
//window.onload = resetTimer;
window.onmousemove = resetTimer; // catches mouse movements
window.onmousedown = resetTimer; // catches mouse movements
window.onclick = resetTimer; // catches mouse clicks
window.onscroll = resetTimer; // catches scrolling
window.onkeypress = resetTimer; //catches keyboard actions
function logout() {
window.location.href = '/action/logout'; //Adapt to actual logout script
}
function reload() {
window.location = self.location.href; //Reloads the current page
}
function resetTimer() {
clearTimeout(t);
t = setTimeout(logout, 1800000); // time is in milliseconds (1000 is 1 second)
t= setTimeout(reload, 300000); // time is in milliseconds (1000 is 1 second)
}
}
idleTimer();
</script>
@gerard-kanters

This comment has been minimized.

Copy link
Owner Author

gerard-kanters commented Apr 25, 2015

Including this javascript file will create timers for user inactivity. Provide a correct url for automatic logout for your site. If included in a page, the page will reload after 5 minutes when the user is inactive. Inactive means, no keyboard strokes, mouse movement, scrolling etc..

You can adapt the timers, just keep in mind that time is measured in milliseconds (1000 is 1 second)

@ewinslow

This comment has been minimized.

Copy link

ewinslow commented Apr 25, 2015

I appreciate your desire to give folks a good experience but I fear this approach might backfire on you.

I recommend against logging folks out automatically. This provides no actual security and is very annoying when it happens. Financial institutions are especially bad with this because they're paranoid that you might have left your tab open on a public computer or something.

Suppose someone is using your app, walks away to make some tea or have dinner or whatever, then comes back later after the timeout period only to find they have to log in again to keep doing what they were doing. Seems annoying. If they have their password saved with their browser, then they are literally just jumping through hoops and no safer for it.

If you choose to go ahead with this, you might want to wrap this code all in (function() { ... }) to avoid polluting the global namespace with common functions like "logout" or "reload."

Hope that helps!

@beck24

This comment has been minimized.

Copy link

beck24 commented Apr 26, 2015

Does this actually work? Looks to me like you would never actually end up logging out because the page would refresh and restart the timers...

@gerard-kanters

This comment has been minimized.

Copy link
Owner Author

gerard-kanters commented Apr 26, 2015

@beck24. The logout function is indeed not working since the timout is longer than the reload.

@ewinslow. You are right that login would be easy especially when user keeps browser login settings. I am trying to work around this by marking login and password fields as autocomplete = "off"

That is not bullet proof either. So I can use some tips here, the idea is to logout after 30 minutes, while still a page load is possible before that and do no reset "var t". May introduce a different value for this, but seems silly ?

@cmalexander

This comment has been minimized.

Copy link

cmalexander commented Feb 6, 2017

Thanks for sharing this! I had been searching high and low for a simple refresh of the screen after a set amount of time. This did the trick! I striped out the log out part and it was perfect.

@komoo1

This comment has been minimized.

Copy link

komoo1 commented Jun 7, 2017

It worth to note that reloading the page alone does not guarantee an active session. i.e If the current page does not use session as seen in the reload() function.

@AndreyNazarchuk

This comment has been minimized.

Copy link

AndreyNazarchuk commented Jul 3, 2018

@ewinslow it is useful if the page is displayed in an office and is getting updates at an interval...just stopping the updates wouldn't help because you also need to hide the client info.

@zerokewl88

This comment has been minimized.

Copy link

zerokewl88 commented Jul 19, 2018

@gerard-kanters Hi, just found this post while thinking of a way to sort this out for our Web System that we have - and just wanted to let you know, that Smart Browers like Chrome keep an eye out on the Input Field names, and suggest automatic completion, it doesnt matter if you set autocomplete="off" the browsers will still always try to help you complete it. I found 2 ways around this, and seems to be the only way that i found, and that is 1) after a period of time when loading a screen with login details to clear the inputs, or 2) change the input field names each time you load the screen with a random input name value . Browsers use these value names to help suggest autocomplete.

In regards to having the automatic logout - depending on the system use / importance i think its quite valid to kick someone out of a system after a period of time to keep say 'records for logged in and current active users' a valid metric if your monitoring that - but of course that is in addition to actually keeping security concerns in mind. If the period to go make a coffee and come back kicks you out and is not exactly helpful, then i would just think that the inactive period is just to short - one of the systems we have does this at a 15 minute mark and works quite well.

@jeffcorey

This comment has been minimized.

Copy link

jeffcorey commented Oct 4, 2018

Very useful script. Thanks for sharing! Anyone tested this on iPad? Just curious if it works with touch as well. Thanks

@alanensina

This comment has been minimized.

Copy link

alanensina commented Jun 11, 2019

Thanks @gerard-kanters, this helped me a lot. :)

@kalyondo

This comment has been minimized.

Copy link

kalyondo commented Jun 14, 2019

WOw! After tens of google searches, I seem to have made head ways, @gerard-kanters thanks many.

@culniga

This comment has been minimized.

Copy link

culniga commented Jul 24, 2019

Instead of listing number of events you can use events on window.blur to clear timer and window.focus to start timer
You can modify this solution: https://stackoverflow.com/questions/1760250/how-to-tell-if-browser-tab-is-active

@Nexxado

This comment has been minimized.

Copy link

Nexxado commented Aug 27, 2019

@culniga You can use the browser's Page Visibility API instead, its more reliable.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.