Version 0.1

What is it?

Customizable cross window/tab utility that checks and notifies the user if they are about to be automatically timed/logged out.

The Scenario:

Company policy is a 20 minute timeout on all web based applications (something like that). The user session is only reset when the web application makes a resource request to the server. User walks away from their desk and returns to the application after 20 minutes where the web application appears to still be logged in. They continue working on their form and click submit only to receive an error that they had been timed out. Pretty standard problem. You need a graceful way to automatically warn and log the user out.

Solution:

Javascript seems like a good candidate except the solution is trickier than it seems. Using the setInterval and setTimeout functions of Javascript offer the functionality we need to get started but it only "relates" to the page it was triggered on. How do we "reset" these timers when the user opens up another tab or window of the same application or a group of applications that all live under one roof? Coordinating the javascript timing of multiple windows/tab instances of an application along with the servers session status is going to take some thinking. A javascript routine that checks against a javascript cookie that all open instances of an application can check against is a solid approach.

Functionality:

  • Cookie management ensures all open application instances stay in sync with themselves and the server.
  • Configurable:
    • Cookie
    • Time Out Seconds
    • Count Down Seconds
    • Check for Time out interval
    • Logout Url
    • Logout Url Parameters
    • Keep Alive Url (to keep the server session alive)
    • window Title
  • Logout Screen lightbox-esque functionality
  • On Window Focus automatically resets countdown/session for all instances
  • Can be easily augmented to integrate other events like mouse/keyboard clicks to keep session alive or even run AJAX calls to save work prior to auto logging out.
  • Clean & organized "namespaced" code easily integrates with any environment using JQuery.
  • Code is simple and straight forward and can be further modified to suit any situation/need.

Dependencies:

  1. JQuery 1.3.x
  2. JQuery Cookie Plugin (by Klaus Hartl)

Recipe

Header Tags

<script language="javascript" src="Scripts/jquery.cookie.js"></script>
<script language="javascript" src="Scripts/jquery.IdleChecker.js"></script>

Usage

var options = {
    Cookie:"IdleCheckerTimeOut",
    CookieExpires:1,
    CookiePath:"/",
    CookieDomain:"kevinlint.com",
    CookieSecure:false,
    TimeOutAfter: 10000,
    CountDownFor: 5000,
    CheckInterval: 1000,
    logoutUrl: "idleCheckerLogout.xxx",
    logoutUrlParams: "?msg=you were logged out",
    keepAliveUrl: "idleCheckerKeepAlive.xxx",
    windowTitle:"myapplication"
}
$.IdleChecker(options);

Demo

Click here for a demo

Download

Click here to download

Documentation

Options

Option Type Required? Desc
Cookie String No, defaults to "IdleCheckerTimeOut" provide a unique name for the cookie that will be used by idleChecker
CookieExpires Numeric No, defaults to 1 Date expires Either an integer specifying the expiration date from now on in days or a Date object.
  • If a negative value is specified (e.g. a date in the past), the cookie will be deleted.
  • If set to null or omitted, the cookie will be a session cookie and will not be retained
  • when the the browser exits.
CookiePath String Yes The value of the path atribute of the cookie.
CookieDomain String Yes The value of the domain attribute of the cookie
CookieSecure Boolean No, defaults to false If true, the secure attribute of the cookie will be set and the cookie transmission will require a secure protocol (like HTTPS).
TimeOutAfter Numeric No, defaults to 1200000 (20 min) Milliseconds until warning message it displayed
CountDownFor Numeric No, defaults to 30000 (30 seconds) How long you want the logout warning message to count down before auto logging the user off (in Milliseconds - fyi: it get's converted to seconds)
CheckInterval Numeric No, defaults to 1000 (1 second) How frequently do you want to check to see if user is timedout.
logoutUrl String Yes Where to send the user when countdown reaches 0
logoutUrlParams String No, defaults to "" Any url string parameter's you'd like to append to the logoutUrl (example: "?msg=logged out")
keepAliveUrl String Yes This is the page that will be ajax requested in order keep your session on the server alive
windowTitle String No, defaults to current document title Title of document/window