ColdFusion Session Timeout with Warning and jQuery Session Refresh

There are times when a user needs to sit on a page for a while either to read or fill out a long form. If their visit is controlled by a session timeout, for example a member site, then the session needs to be refreshed without refreshing the page. My previous post on user session warning used a page refresh to renew the session. This example will refresh the session with a jquery .post so the browser maintains state.

Much of what happens here is very similar to the previous page reload session refresh so you will see some of the same explanatory text. Changes to the code mainly affect the jquery/javascript since the variables and timers need to be reset without refreshing the page.

Javascript is needed to keep track of the time the user has been sitting on the page. The server does not know how long they have been sitting there. It only knows whether or not a request comes in during a session or after the session has expired and acts accordingly at that time. Too late for a warning.

Session Defined: Start to Finish

A session is defined as when a user begins and ends using or visiting a web site. It can be unlimited in length or strictly defined by a timeout period. If the site requires a log in or accesses sensitive data, it should time out after a period of inactivity. They can end a session by logging out or closing the browser.

Inactivity means the user has done nothing, made no requests of the web server, during a specified time. Ajax requests usually do not count.


The session time left is determined by the server, and, if you want to poll the server with an Ajax request, go for it. Javascript is used to keep track of the time left in the session.

The demo uses a simple log in with session timing handled by jquery and javascript. When the session expiration approaches, the user is warned and given an opportunity to restart the session. If the session time limit is reached, the user is prompted to log in again. If they ignore that prompt, the page automatically redirects to the log in form. In the demo this sequence of events takes 40 seconds to complete and is broken down as follows:

  1. Session timeout: 30 seconds
  2. Timeout warning: 20 seconds
  3. Session expired warning: 10 seconds
  4. Redirect to log in page: 10 seconds

Interrupting the User

The user’s attention can be diverted away from other open windows to the eminent session expiration by using a javascript alert in place of the jquery dialog box. Personal preference.

Code Breakdown

The application.cfc controls the session by creating non-persistent cookies for CFID and CFTOKEN so the session expires when the user’s browser closes. It also sets the session variable sessionStartTime. The sessionStartTime variable is used to illustrate the fact that the application.cfc function OnSessionStart only fires once. It does not fire every time a session is renewed or restarted.

RequestStartTime is set in the OnRequestStart function to provide a reference for comparison later. See “Just for Fun” section below.

    hint="Handle the application.">
    <!--- Set up the application. --->
    <cfset THIS.Name = "sessionrefreshtest" />
    <cfset THIS.ApplicationTimeout = CreateTimeSpan(0,1,0,0) />
    <!--- CreateTimeSpan(days, hours, minutes, seconds) --->
    <cfset THIS.SessionTimeout = CreateTimeSpan(0,0,0,30) />
    <cfset THIS.SessionManagement = true />
    <cfset THIS.SetClientCookies = false />
        hint="Fires ONLY ONCE when session first created and not when session renewed/restarted.">       
        <!---set cfid/cftoken as non-persistent cookies so session ends on browser close --->
        <cfif not IsDefined("Cookie.CFID")>
            <cflock scope="session" type="readonly" timeout="5">
                <cfcookie name="CFID" value="#session.CFID#">
                <cfcookie name="CFTOKEN" value="#session.CFTOKEN#">
                 <cfset session.SessionStartTime = Now() />
        <cfreturn />
        hint="Fires at first part of page processing.">
        <!--- Define arguments. --->
        <cfset session.RequestStartTime = Now() />
        <cfreturn true />

The log in page checks for a query string variable called ‘expired’ and, if present, deletes the session loggedin variable. This is there because the code is going to control the expiration of the session eliminating the need to compensate for browser latency. The actual session start time the time the page loads can differ by several seconds. To avoid having to add time to the session or any other fancy guesswork, when the allotted session time has expired according to the javascript timer on the page, they are done – session over.

If they are logged in, they get bumped to the index page. The rest is the logic that handles the log in form.

Note: I would not recommend handling a log in form this way. This is for demonstration only.

<cfif isDefined("url.expired") AND url.expired>
    <cfset StructDelete(session,"loggedin") />

<cfif isDefined("form.username") AND isDefined("") AND form.username EQ "session" AND EQ "test">
    <cfset session.loggedin = true />

<cfif StructKeyExists(session, "loggedin") AND session.loggedin>
    <cflocation url="index.cfm" addToken="no" />

Other than the log in form and a message for the user, that’s all there is to the log in page.

Handling Session Timeout

The index page handles the session timeout code. This could be a separate javascript included in every page. The first block simply determines if they are logged in. If they are not, send them to the login page. If they are, load the index page.

<!---if not logged in, send them to login page, else load the index page--->
<cfif NOT StructKeyExists(session, "loggedin") OR NOT session.loggedin>
    <cflocation url="login.cfm" addToken="no" />
 <!---Load the page --->

Now the time variables are set and the a javascript timer is set to check the session every 10 seconds.
Javascript uses milliseconds so for clarity the time intervals multiply the number of seconds by 1,000. You could put 10000 in for 10 seconds but I think 10*1000 helps me determine that it is 10 seconds quite a bit faster. Do what is comfortable for you.

Also, a flag is set to determine if the warning dialog box has been opened and the countdown has begun.

//Your timing variables in number of seconds
//total length of session in seconds
var sessionLength = 30; 
//time warning shown (10 = warning box shown 10 seconds before session starts)
var warning = 10;  
//time redirect forced (10 = redirect forced 10 seconds after session ends)     
var forceRedirect = 10; 

$(document).ready(function() {
	//event to check session time left (times 1000 to convert seconds to milliseconds)
    checkSessionTimeEvent = setInterval("checkSessionTime(requestTime)",10*1000);

//event to check session time variable declaration
var checkSessionTimeEvent = "";

//time session started
var requestTime = new Date();

//initial set of number of seconds to count down from for countdown ticker (10,9,8, get the idea)
var countdownTime = warning;
//create event to start/stop countdownTicker
var countdownTickerEvent = ""; 

//initially set to false. if true - warning dialog open; countdown underway
var warningStarted = false;

function checkSessionTime(reqTime)
	//get time now
	var timeNow = new Date(); 
	//clear any countdownTickerEvents that may be running	
	//difference between time now and time session started variable declartion
	var timeDifference = 0;
	//session timeout length
	var timeoutLength = sessionLength*1000;
	//set time for first warning, ten seconds before session expires
	var warningTime = timeoutLength - (warning*1000);
	//force redirect to log in page length (session timeout plus 10 seconds)
	var forceRedirectLength = timeoutLength + (forceRedirect*1000);
	timeDifference = timeNow - reqTime;

     if (timeDifference > warningTime && warningStarted === false)
            //reset number of seconds to count down from for countdown ticker
			countdownTime = warning;
			//call now for initial dialog box text (time left until session timeout)
            //set as interval event to countdown seconds to session timeout
            countdownTickerEvent = setInterval("countdownTicker()", 1000);
			warningStarted = true;
    else if (timeDifference > timeoutLength)
    		//close warning dialog box if open
            if ($('#dialogWarning').dialog('isOpen')) $('#dialogWarning').dialog('close');

     if (timeDifference > forceRedirectLength)
        	//clear (stop) checksession event
            //force relocation

The countdownTicker function provides a countdown inside the warning dialog box to prompt the user to act now. It uses a timer that fires every second for a 5,4,3,2,1 effect inside the dialog box.

function countdownTicker()
	//put countdown time left in dialog box
	//decrement countdownTime

And, the dialog boxes either allow the user to restart the session or, if they did nothing when the warning popped up, it logs them out by redirecting to the log in page with the expired variable in the query string. Also, it redirects to the log in if they hit the close button on the dialog box rather than the Login button on the dialogExpired dialog box.

        // jQuery UI Dialog    
            autoOpen: false,
            width: 400,
            modal: true,
            resizable: false,
            buttons: {
                "Restart Session": function() {
		   //reset session on server
		   //reset the variables
		   requestTime = new Date();
		   warningStarted = false;
		   countdownTime = warning;
		   //clear current checkSessionTimeEvent and start a new one
		   checkSessionTimeEvent = "";
		   checkSessionTimeEvent = setInterval("checkSessionTime(requestTime)",10*1000);
            autoOpen: false,
            width: 400,
            modal: true,
            resizable: false,
            close: function() {
            buttons: {
                "Login": function() {

The “Restart Session” button sends a post request to a ColdFusion page that sets a session variable. That act alone refreshes the session.

<!---Setting the give_me_more_time session variable refreshes the session.--->
<cfset session.give_me_more_time = true />
<!--- Below is optional. There just so you can see a response from the server in firebug. --->
<cfoutput>session.RequestStartTime: #session.RequestStartTime# session.loggedin: #session.loggedin#</cfoutput>

The dialog box contents are at the bottom of the page but they could be just about anywhere in the body.

<!--Dialog box contents-->
<div id="dialogExpired" title="Session (Page) Expired!"><p><span class="ui-icon ui-icon-alert" style="float:left; margin:0 7px 0 0;"></span> Your session has expired!<p id="dialogText-expired"></p></div>

<div id="dialogWarning" title="Session (Page) Expiring!"><p><span class="ui-icon ui-icon-alert" style="float:left; margin:0 7px 0 0;"></span> Your session will expire in <span id="dialogText-warning"></span> seconds!</div>

Just for Fun

You can view the response from the restrart_session.cfm in Firebug and compare it to the time on the page from the dumped session vars.
session time compare

Usual recommended jQuery and CF reading:

Download zip of all files

Posted in ColdFusion, jquery, Web development. Tags: , . Permalink. Both comments and trackbacks are closed.


  1. February 6, 2011 at 8:20 pm | Permalink

    I just did something similar, but I discovered that you don't even have to do anything to the "loader" page to keep the session alive. All you have to do is load a CFM page and it resets the session.

    I made a jQuery plug-in that creates an iFrame on the page that reloads a CFM file every X minutes.

    Interesting to see another way of doing this. I didn't even think about doing a POST. Very cool.

  2. Michael Grant
    September 21, 2010 at 1:01 pm | Permalink

    Please note that there is a minor logic flaw on both line 11 and line 124.

    This line:


    Should be changed to:


    As soon as you change the warning variable to anything more than 10 seconds the countdown stops displaying after the first ten iterations. It took about an hour of debugging to figure out the hole in the logic.

    Here's hoping you don't have to bang your head against the desk like I did.

    Other than that nice work.

  3. September 10, 2010 at 7:45 am | Permalink

    The session is maintained or expired across both tabs. The only issue is the javascript timer which runs independently on the page itself. A new tab starts a new timer. However, the session is active or inactive at the same time in both windows.

  4. Sushil
    September 1, 2010 at 3:13 pm | Permalink

    Hi Jen,

    Thanks for such a good example. That's exactly what I was looking for. However I have a doubt about it working when you open a new tab and now there are two windows. In this case the first window will take the user to login page even if the session is active in other window. Correct me if I am wrong.


  5. Brian
    August 27, 2010 at 4:56 pm | Permalink

    Hi Jen,
    Why are you clearing and resetting your interval? My novice understanding of setInterval vs. setTimeout is that the former is a "set it and forget it" sort of function.

  6. August 10, 2010 at 7:06 pm | Permalink

    Cool! Thanks. Glad it helped.

  7. Rus Russell
    August 10, 2010 at 5:26 pm | Permalink

    This was awesome.

    I am new to cf and jQuery. I found your tutorial extremely helpful.

    I am currently looking at your Amazon list to see what I can get you.

  8. July 24, 2010 at 3:34 pm | Permalink

    Was looking at something related and stumbled across this. Nice work. Keep it up.

  9. Christopher Jazinski
    April 18, 2010 at 3:32 pm | Permalink

    Awesome! Thanks for sharing this.

One Trackback

  1. By Session Timeout Warning on August 20, 2010 at 8:58 am

    […] ColdFusion Session Timeout with Warning and jQuery Session Refresh – __________________ jmurrayhead If you agree with me… click the icon! If my post solved your problem, click the button in the lower right-hand corner of the post. If you like it here…throw us a few bones to help support us. Join our Folding team: DeveloperBarn Folding […]