Question

We are working with a Single Sign On provider to do a web app that needs to include an image url on every page to keep their session alive. This would work great if it were a standard web app with multiple pages, but we are making it a single page app built on extjs.

Looking for ideas on how to keep the session alive based on user activity when we won’t be requesting pages that contain the “tracking pixel” they currently use since all our server interaction will be json/ajax based and most of it will be using sencha’s Ext Direct for most of the client to server communications. Surely someone else has done this. Session inactivity timer is on the order of 10 minutes.

Just wondering if anyone else has run into this, and how you handled it. I can prevent the session timeout easy enough with a setInterval call, but that sort of defeats the whole purpose of the inactivity timer.

Answer 1

So the point is to detect if user has done something on the page in a period and if so, make a call to keep his session alive.

My idea is whenever user does something, record the time that the activity happens. And a check function will be invoked regularly to determine if a make-session-alive call should be made.

First, keep two global variables:

//The time when last make-session-alive call is made.
var lastSyncTime = new Date().getTime();

//The time when user did something on the page. Reassigned per user activity.
var lastActiveTime = lastSyncTime;

Second, add listeners to record user activity time:

function recordFn(){
   lastActiveTime = new Date().getTime();
}

//If there's a lot of clickable stuff, add a click listener to the container
Ext.getBody().on('click', recordFn);

//If there's a lot of input stuff
Ext.getBody().on('keypress', recordFn);

//If ajax call should be detected
Ext.Ajax.on('beforerequest', recordFn);

Last, regularly call the check function:

SessionExpiredTime = 1000 * 60 * 10; //ten minutes.
function checkFn(){
   if( lastActiveTime - lastSyncTime < SessionExpiredTime ){
     //Make Ajax call to refresh session...

     //Reassign
     lastSyncTime = new Date().getTime();
     lastActiveTime = lastSyncTime;
   }
}
setInterval(checkFn, SessionExpiredTime - 1000 * 60);