Session timeout
Overview
Project lead: Roch Lambert (@rlambert27)
Purpose
This sub project will help web asset owners provide session timeout and inactivity timeout functionality. When a user requests a page with this plugin implemented their session will begin. After the specified session period, they will be notified that their session is about to timeout. At this point, they will have the option to remain logged in by clicking "OK", or logging out by clicking "Cancel". At anytime during the session, if the user remains idle for a specified amount of time, they will be notified that they're session is about to time out. In either case, if the user does not respond to the timeout notification within a specified amount of time, once they click either "OK" or "Cancel" they will be automatically redirected to the log out page.
Benefits
- Timing can be adjusted easily in the parameters
- Conforms to WCAG 2.0 AA
- Progressive enhancement approach
Recommended usage
On all pages, as appropriate.
Implementation
The code you're allowed to edit is:
<span class="wet-boew-sessiontimeout" data-wet-boew='{"ajaxLimiter": 200000, "inactivity": 1200000, "reactionTime": 30000, "sessionalive": 1200000, "logouturl": "./", "refreshOnClick": true, "refreshCallbackUrl": "./"}'></span>
This allows you to configure the component:
ajaxLimiter
: This is the amount of time between ajax requests to refresh the server side session page.inactivity
: This is the inactivity period of time after which the dialog message will appear.reactionTime
: This is the period of time the user has to perform an action with the dialog message.sessionalive
: This is the period of time for the session to stay alive until the dialog message appears.logouturl
: This is the URL that users are sent to when the session has expired.refreshOnClick
: Setting this to true or false will enable or disable the ajax refresh using therefreshCallbackUrl
parameter.refreshCallbackUrl
: This is the URL to perform an ajax refresh, must return true/false.
The only required parameter is logouturl, all other fields are optional. The default code would be:
<span class="wet-boew-sessiontimeout" data-wet-boew='{"logouturl": "./"}'></span>
IMPORTANT NOTE: The ajaxLimiter
, inactivity
, reactionTime
and sessionalive
parameters are set in milliseconds. The only required parameter is the logouturl
default inactivity
and sessionalive
is set to 20 minutes with a 30 second confirmation time with the dialog message. The ajax request will be done every 2 minutes by default using the refreshCallbackUrl
parameter. The refreshCallbackUrl
must not be a page containing the timeout function again as a loop will be created, it should be simply a viewless page that refreshes the session.
Need help with the conversion? See: http://www.calculateme.com/Time/Minutes/ToMilliseconds.htm
IMPORTANT NOTE: Your sessionalive
and inactivity
parameters should be equal to your web server session alive time minus the reactionTime
time. If you set your sessionalive
time and inactivity
time to the same as your web server without taking into consideration the reactionTime
time then the session will have ended by the server as soon as the popup appears to extend the session.
Examples
Development
The code for the session timeout is located in several places within the source folder of WET:
- js/workers/sessiontimeout.js - contains the JavaScript code for the session timeout
- js/sass/includes/_sessiontimeout.scss - contains the CSS for the session timeout
- js/sass/includes/_sessiontimeout-ie.scss - contains the IE7/8 specific CSS for the session timeout
- js/images/sessiontimeout/ - contains the images for the session timeout
Known Issues
- Providing a very short time frame could cause issues with certain disability groups
- Will not work if JavaScript is disabled
Version History
- Date modified: