Using javascript to reset the meta tag to prevent it from refreshing the page

Question

We have an legacy application (mixture of classic ASP and ASP.net) that has a few Ajax content rich pages.The expectation is that the users of the site performs a set of tasks on the page that can span a fair amount of time say, 15-30 minutes.

One of the requirements is that users logging in to the site be automatically logged out after 15 mins of inactivity. This is currently being achieved by using the meta tags for redirecting the user to the logout page after 15 minutes of inactivity in the page.

<meta name='Refresh' http-equiv="Refresh" content="900;URL=/someurl/logout.asp">

The problem we're having is that the browser doesnt think there has been any activity on the page despite having many AJAX interactions with the server. So after the 15 minutes of what the browser thinks as inactivity, the user is logged out automatically even if they are in the middle of doing something.

Inspired by this message board post we tried to fix the annoyance by using javascript(JQuery) like so

The below would be an event handler such as clicking of the save on the page etc. for simplicity here is the page load to modify the refresh time to 5 seconds

$(document).ready(function() {
    var selector = 'meta[name=Refresh]';
    var content = $(selector).attr("content"); //"900;URL=/someurl/logout.asp"
    $(selector).attr("content", "5;URL=/someurl/logout.asp"); 
});

The intent being (re)setting the meta tag content the page refresh timer would be reset. Unfortunately this doesnt seem to work (in IE).

Since this is a legacy application, some of the decisions i.e. to use meta tags etc. are baked in. The question is, is there a way to get meta tag refresh to peacefully co-exist with an Ajax application? Am I doing something wrong and is there a way to solve this problem?

Answer 1

assuming you are using jQuery something like this might work. I haven't tested it and don't know if browsers will read the a meta tag within a noscript element in the document head.

Replace your meta tag with this:

<script type="text/javascript">
    window.onload = function(){
        var timer = null,
            time=1000*60*15, // 15 minutes
            checker = function(){
                if(timer){clearTimeout(timer);} // cancels the countdown.
                timer=setTimeout(function() { 
                    document.location="/someurl/logout.asp";
                },time); // reinitiates the countdown.
            };
        checker(); // initiates the countdown.
        // requires jQuery... (you could roll your own jQueryless version pretty easily though)
        if(window.jQuery){
            // bind the checker function to user events.
            jQuery(document).bind("mousemove keypress click", checker);
        }
    };
</script>
<noscript>
    <meta name="Refresh" http-equiv="Refresh" content="900;URL=/someurl/logout.asp">
</noscript>

There are definitely better ways of doing this. Like serving 2 pages...one for users with javascript and one without.

Or just disable the app for people without javascript. :o)

Edit according to this page: http://www.google.com/support/forum/p/Webmasters/thread?tid=25c023fea4ea60a4&hl=en the meta refresh should work inside the noscript element.