The problem: I have a site with a recently installed SSL certificate that is very dependent on POST calls over AJAX. The site worked fine on Internet Explorer 8 before the SSL certificate, but now does not.
Since I haven't been able to get a good way to read any error messages, I haven't been able to pin down where the bug is coming from. I will try to list as much as I know/ have figured out, and I greatly appreciate any suggestions.
What I know:
- On IE8, the site will not perform any AJAX POST calls that contain data
- The site worked fine until recently. The SSL certificate has been the most significant change since we originally had the site working in IE8
- If I change the AJAX call to use GET, or if I change it to use POST without sending any data, it reaches the server successfully. Unfortunately, the site requires using POST with data.
- The site works perfectly on Chrome, FF, Safari, Opera, and IE11. I haven't had the opportunity to test IE10 or IE9 since we found the bug. We won't really need to support < IE8.
- I have tried to make a sample AJAX call using both vanilla JS and jQuery (code for both is below). Neither has worked for IE8, and both have worked for everything else.
- The AJAX call is being made to the same domain (and even the same PHP file) that is serving the main page, so there shouldn't be any issues with cross domain AJAX calls (unless a bug is making it appear that way)
- Attempting to replicate the issue, I checked out another one of our sites that similarly uses SSL and has a lot of AJAX calls. It had the same issues (at least we are consistent), but apparently has never been brought to our attention because apparently that client doesn't use IE8 in the workplace.
- When running on IE8, the call fails without throwing errors. In my vanilla JS test, I tried to alert the readyState and status on failure (which returned '4' and '0' respectively). Strangely enough, IE8 threw an error on the alert that showed the readyState and status.
- I am testing on an emulated version of IE8 (I have a Mac), so there is a possibility that my personal configuration on it is complicating things. However, I had a co-worker test it (also an emulator) and he received the same result, and I am almost certain that the people who have reported problems were using IE8. I have enabled native XMLHTTP support in my install of IE8 (that was apparently a common issue)
- Apparently another common issue with IE8 and AJAX is caching - I have tried setting the header 'cache-control' to both 'no-cache' and 'public', and neither works.
Here is the vanilla JS code:
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange=function(){
if (xmlhttp.readyState==4 && xmlhttp.status==200){
/*
* All the code that is supposed to run on success ... IE8 doesn't run anything in here
*/
} else {
alert(xmlhttp.status); // This throws an error, but then displays '0'
}
}
xmlhttp.open("POST",login_address,true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send("email="+dataVar.email+"&password="+dataVar.password);
Here is the jQuery version:
$.ajax({url:login_address,
type: 'POST',
data: dataVar,
headers: { "cache-control": "no-cache" },
success: function(msg){
/*
* All the code that is supposed to run on success ... IE8 doesn't run anything in here
*/
},
error: function (jqXHR, textStatus, errorThrown){
alert('ErrorThrown: '+errorThrown+' ErrorStatus: '+textStatus); // This returns 'ErrorThrown: Unknown ErrorStatus: Unknown'
}
});
If you need to try out an example yourself, you can go to https://www.kenkochallenge.com/ and click on the Login link in the top right. You can enter anything in the email and password fields - When you click Login, if the call to the server was successful, the form will give an error message that your username and password didn't match.
Again, thank you for any suggestions! If anyone has an idea, please let me know and I will try it out.