Geek Answers Handbook

Javascript setTimeout and redirection - IE freezes

I have a script on my page that deals with session timeouts, redirecting the user on the client side when the session expires. The full code is a bit more complicated, but I brought the code to what causes me the problem:

<head runat="server"> <script src="javascript/jquery-1.7.2.min.js" type="text/javascript"> </script> <script type="text/javascript"> /* Please see document ready method at the bottom that sets up this code, calling CheckActivity() at intervals. */ var warningInterval, redirectTimeout; var now = 1; function TimeoutRedirect() { window.location.href = "Test2.aspx"; } //In this example this is a bit of a null op, but in real //code this will display a warning a minute or so prior to redirect. //This is required to recreate... function CheckActivity() { if (now > 4) { clearInterval(warningInterval); redirectTimeout = setTimeout(function () { TimeoutRedirect(); }, 5000); } //Some visual activity for testing purposes. $("#CheckActivityCount").text(now); now++; } $(document).ready(function () { warningInterval = setInterval(function () { CheckActivity(); }, 1000); }); </script> </head> <body> <form id="form1" runat="server"> <div> <div id="CheckActivityCount"> </div> </div> </form> </body>

This code works as expected, redirecting after (approximately) ten seconds. However, if after the interval at which the call to CheckActivity ends (after 5 seconds), I lock my screen and then unlock it after the redirect due to what happened (another 5 seconds), the URL the address in my IE window went to 'test2.aspx', but the window seems to be frozen (the first page is still displayed).

This ultimately does not freeze, but it takes 10 seconds to go to the next page.

This seems to be happening in IE (IE9 on my machine) and works fine in chrome and firefox (and, oddly enough, IE6).

(Test2.aspx is a very simple page containing only the text "success".)

Just noting that if I change the redirection from test.aspx to http://www.google.com/ does not seem to be a problem. However, it still doesn't work if I change test2.aspx as an absolute URL (the only major difference is that it will be the localhost address).

+7
source share
3 answers

I ran into the same type of problem, and I created another question so that I could focus on what, in my opinion, is the heart of the problem. (IE does not redraw when the computer is in a locked screen.)

In any case, I finally figured out how to solve this. You can see my answer here . Essentially, you can fix your problem by putting some JavaScript inside your automatic logout page to periodically refresh the contents of the page .... and this will cause IE to redraw the page.

That way, I can execute any automatic save logic that I want before their session on their current page expires, and then delete them to the auto-exit page.

+2
source

It sounds like IE goes into some kind of “pause” mode when you lock the screen to avoid using render cycles, etc. Perhaps you can try to associate the redirection with the onFocus event of the window, for example:

 window.onfocus = function(){ window.location.href = "Test2.aspx"; } window.location.href = "Test2.aspx";

In theory, this should redirect the page as soon as the focus is restored (i.e. when you unlock the screen). If the window already has focus, then this should not matter.

+1
source

I don’t have IE here, so I can’t check, but maybe you can defer the call to TimeoutRedirect until the window is active again.

I have illustrated this sample page .

The principle is pretty simple. During the interval and timeout, you set a variable if the window becomes inactive because the user switches the tab or locks the screen. After the timeout, you check if the focus has focus. If not, set another variable to pass the focus handler to run your session termination function. This should help with the redirect.

 sessionEnd: function() { this.sessionEnded = true; var windowEvents; if (!this.isInactive) { console.log("window active, sessionEnd called"); alert("THE END"); this.removeEvents(); // window.location.href = "test.aspx"; } else { console.log("window inactive, sessionEnd will be called again on focus"); } }, handleEvent: function(e) { // only do something if the window loses or gains focus if (this.eventBlurRegex.test(e.type)) { this.isInactive = true; } else if (this.eventFocusRegex.test(e.type)) { this.isInactive = false; if (this.sessionEnded === true) { this.sessionEnd.call(this); } } },

For older versions of IE that do not support the handleEvent function, I used the polyfill found in CSS NInja and changed it a bit.

Hope this helps.

+1
source

More articles:


All Articles