C
coolvirus
Kind of long but please bear with me.
I built a website that shows pricing information, as close to real-time
as possible. It consists of a main page and the main page pops up a
child window (onLoad event on the main window).
The child window uses an XMLHttpRequest object to retrieve the updated
pricing info. It sends a request to a server side script. This script
looks for new prices and sends a response accordingly right away if
there are any. If there aren't any, the server script loops for 30
seconds, constantly checking for new prices and after 30 seconds of not
finding any new content, it sends a response accordingly. If at any
time during this 30 second loop the script finds new content, it breaks
out of the loop and send the appropriate response. Once the client
receives the response, it displays the new info if any and sends the
request to the server again to look for new prices. The server script
is written in PHP.
The problem I'm experiencing (only happens with IE) takes place when
the user closes the child window. When they reload the main window or
re-login in order to open the child window with the pricing info again,
that instance of IE takes FOREVER to load the main website and
sometimes it locks up.
I've done some research and found that IE allows 2 HTTP connections at
a time. I also read somewhere that IE has a bug that keeps connections
open when they should be closed, allowing for the possibility of most,
if not all, connections to be tied up.
I think I'm having that problem because after the user kills the child
window and reloads the main window (to pop up the child window again),
the main window loads its contents, one at a time, very slowly, and
only after the child window receives the response from the server. So
after the user closes the child window for whatever reason and then
reloads the main window in an attempt to popup the child window again,
this is what I think it's happening:
1. After user reloads main window, it attempts to load its contents
VERY SLOWLY, probably because there are hanging HTTP connections that
were not terminated by the browser when the child window was first
closed.
2. Child window is popped up. It sends a request to server script to
fetch new info. The Connection header is set to "close" in order to
terminate that connection once the transaction is finished (this was an
attempt to make sure there were no connections "hanging").
3. Server script loops for a few seconds until updates come in. Once
they do, it sends a response to the client.
4. Client receives response. Connection "should" be terminated (don't
know how to determine this for sure). At this point, the main window
loads a little more but not completely.
5. Client sends request again and ... (Go back to step 3).
The only way to solve this problem is to close all windows (main
website and child window) and re-login from scratch. Sometimes the
problem is so bad that ALL instances of IE need to be killed.
I added a function to be called when the child window is closed
(onBeforeUnload event) to abort the XMLHttpRequest (only when status is
not 0 or 4, otherwise unpredictable results might occur) but this did
not help.
Does anyone have any idea as to why the website is so eternally slow to
load or why does it lock up sometimes? I'm kind of new at using the
XMLHttpRequest and don't know if I'm handling things correctly. Any
input will be greatly appreciated.
Here's the code for the child window for illustration purposes:
<html>
<head><title>Updates</title>
<script src="ajax_util.js" type="text/javascript"></script>
<script type="text/javascript">
var doc = 'check_updates_file.php';
// initialize XMLHttpRequest object
var xmlobj=null;
function show_new_content()
{
// this shows new content.
}
function setRequest()
{
loopRequest();
}
function loopRequest()
{
// check for existing requests
if( xmlobj != null && xmlobj.readyState != 0 && xmlobj.readyState
!= 4 )
{
xmlobj.abort();
}
xmlobj = createXMLHttpRequest();
xmlobj.onreadystatechange=stateChecker;
xmlobj.open('GET',doc,true);
// this should prevent the browser from caching
xmlobj.setRequestHeader("Cache-Control", "no-cache");
xmlobj.setRequestHeader("If-Modified-Since", "Wed, 31 Dec 1980
00:00:00 GMT");
xmlobj.setRequestHeader("Expires", "Wed, 31 Dec 1980 00:00:00
GMT");
// this should make sure the connection is closed after
// receiving the response from the server
xmlobj.setRequestHeader("Connection", "close");
xmlobj.send(null);
}
function stateChecker()
{
var data=new Array();
if( typeof(xmlobj) != "undefined" && xmlobj != null &&
xmlobj.readyState == 4 )
{
if( xmlobj.status == 200 )
{
data=xmlobj.responseText.split('\n');
if( data[0] == "NEW CONTENT" )
{
show_new_content();
}
}
else if( xmlobj.status != 0 )
{
alert("Failed to get response: " + xmlobj.status + " - " +
xmlobj.statusText);
}
setRequest();
}
}
function winClose()
{
if( typeof(xmlobj) != "undefined" && xmlobj != null &&
xmlobj.readyState != 0 && xmlobj.readyState != 4 )
{
xmlobj.abort();
}
}
</script>
</head>
<body onload="setRequest();" onbeforeunload="winClose();">
... some content here ...
</body>
</html>
I built a website that shows pricing information, as close to real-time
as possible. It consists of a main page and the main page pops up a
child window (onLoad event on the main window).
The child window uses an XMLHttpRequest object to retrieve the updated
pricing info. It sends a request to a server side script. This script
looks for new prices and sends a response accordingly right away if
there are any. If there aren't any, the server script loops for 30
seconds, constantly checking for new prices and after 30 seconds of not
finding any new content, it sends a response accordingly. If at any
time during this 30 second loop the script finds new content, it breaks
out of the loop and send the appropriate response. Once the client
receives the response, it displays the new info if any and sends the
request to the server again to look for new prices. The server script
is written in PHP.
The problem I'm experiencing (only happens with IE) takes place when
the user closes the child window. When they reload the main window or
re-login in order to open the child window with the pricing info again,
that instance of IE takes FOREVER to load the main website and
sometimes it locks up.
I've done some research and found that IE allows 2 HTTP connections at
a time. I also read somewhere that IE has a bug that keeps connections
open when they should be closed, allowing for the possibility of most,
if not all, connections to be tied up.
I think I'm having that problem because after the user kills the child
window and reloads the main window (to pop up the child window again),
the main window loads its contents, one at a time, very slowly, and
only after the child window receives the response from the server. So
after the user closes the child window for whatever reason and then
reloads the main window in an attempt to popup the child window again,
this is what I think it's happening:
1. After user reloads main window, it attempts to load its contents
VERY SLOWLY, probably because there are hanging HTTP connections that
were not terminated by the browser when the child window was first
closed.
2. Child window is popped up. It sends a request to server script to
fetch new info. The Connection header is set to "close" in order to
terminate that connection once the transaction is finished (this was an
attempt to make sure there were no connections "hanging").
3. Server script loops for a few seconds until updates come in. Once
they do, it sends a response to the client.
4. Client receives response. Connection "should" be terminated (don't
know how to determine this for sure). At this point, the main window
loads a little more but not completely.
5. Client sends request again and ... (Go back to step 3).
The only way to solve this problem is to close all windows (main
website and child window) and re-login from scratch. Sometimes the
problem is so bad that ALL instances of IE need to be killed.
I added a function to be called when the child window is closed
(onBeforeUnload event) to abort the XMLHttpRequest (only when status is
not 0 or 4, otherwise unpredictable results might occur) but this did
not help.
Does anyone have any idea as to why the website is so eternally slow to
load or why does it lock up sometimes? I'm kind of new at using the
XMLHttpRequest and don't know if I'm handling things correctly. Any
input will be greatly appreciated.
Here's the code for the child window for illustration purposes:
<html>
<head><title>Updates</title>
<script src="ajax_util.js" type="text/javascript"></script>
<script type="text/javascript">
var doc = 'check_updates_file.php';
// initialize XMLHttpRequest object
var xmlobj=null;
function show_new_content()
{
// this shows new content.
}
function setRequest()
{
loopRequest();
}
function loopRequest()
{
// check for existing requests
if( xmlobj != null && xmlobj.readyState != 0 && xmlobj.readyState
!= 4 )
{
xmlobj.abort();
}
xmlobj = createXMLHttpRequest();
xmlobj.onreadystatechange=stateChecker;
xmlobj.open('GET',doc,true);
// this should prevent the browser from caching
xmlobj.setRequestHeader("Cache-Control", "no-cache");
xmlobj.setRequestHeader("If-Modified-Since", "Wed, 31 Dec 1980
00:00:00 GMT");
xmlobj.setRequestHeader("Expires", "Wed, 31 Dec 1980 00:00:00
GMT");
// this should make sure the connection is closed after
// receiving the response from the server
xmlobj.setRequestHeader("Connection", "close");
xmlobj.send(null);
}
function stateChecker()
{
var data=new Array();
if( typeof(xmlobj) != "undefined" && xmlobj != null &&
xmlobj.readyState == 4 )
{
if( xmlobj.status == 200 )
{
data=xmlobj.responseText.split('\n');
if( data[0] == "NEW CONTENT" )
{
show_new_content();
}
}
else if( xmlobj.status != 0 )
{
alert("Failed to get response: " + xmlobj.status + " - " +
xmlobj.statusText);
}
setRequest();
}
}
function winClose()
{
if( typeof(xmlobj) != "undefined" && xmlobj != null &&
xmlobj.readyState != 0 && xmlobj.readyState != 4 )
{
xmlobj.abort();
}
}
</script>
</head>
<body onload="setRequest();" onbeforeunload="winClose();">
... some content here ...
</body>
</html>