Internet Explorer Ajax Requests Using GET
created February 22, 2009 at 11:33 pm
So after getting this page up and running I had to do my fair share of debugging to make things work with Internet Explorer. This is the part of the day that every web developer dreams about. "What is going to break this time??".
Anyway I decided to use my blog to share with you all solutions to problems I have come across so that you don't have to spend hours banging your head against the wall like I did.
The first topic I want to discuss in this series is ajax calls using GET.
To start I will paste to you the definition of GET from the World Wide Web Consortium
Basically GET shows you what you should see based on the URI you request. For example on Facebook every user has their own profile defined by /profile.php?id=1234567 where the number following the = is your user id in the database.
Really GET should be used for just that: determining what to show you. Facebook uses GET to track things. Yes, Facebook tracks almost everything you do. For example when you go to the home page you will see &ref=logo or &ref=home in the URL depending on which link you clicked on. Facebook even attaches your user id to the url when you view another user's photos. This means they can find all the hotties that people look at pictures of the most, but that is a story for another time.
So you might wonder where I am going with this... On this site I set it up so blog comments are posted and retrieved with AJAX calls. This means the page doesn't have to refresh when you post a comment. Everything seemed great until I tried posting a comment on Internet Explorer. No matter how many times I refreshed the page I couldn't get my comment to show up. Does this mean it isn't being added to the database? Does this mean the AJAX call is not firing? No and no. What this means is that Internet Explorer caches AJAX requests made using GET.
For many things this would be fine like a page that is all static content, but for something like blog comments they are changing all the time (not on this site, however) this is unacceptable.
So there are a few ways to solve this problem including changing all requests to be POST. I opted to pass the current timestamp along in the URL. This tricks Internet Explorer into thinking that it is a page that has never been accessed before and you will receive the correct response :).
Here is the code (note I use JQuery for all my javascripts):
As you can see it is super simple. new Date().getTime(); returns the current UNIX timestamp in milliseconds so we get up to date comments! Go ahead and leave one to try it for yourself
Anyway I decided to use my blog to share with you all solutions to problems I have come across so that you don't have to spend hours banging your head against the wall like I did.
The first topic I want to discuss in this series is ajax calls using GET.
To start I will paste to you the definition of GET from the World Wide Web Consortium
- GET
The GET method means retrieve whatever information (in the form of an entity) is identified by the Request-URI. If the Request-URI refers to a data-producing process, it is the produced data which shall be returned as the entity in the response and not the source text of the process, unless that text happens to be the output of the process.
Basically GET shows you what you should see based on the URI you request. For example on Facebook every user has their own profile defined by /profile.php?id=1234567 where the number following the = is your user id in the database.
Really GET should be used for just that: determining what to show you. Facebook uses GET to track things. Yes, Facebook tracks almost everything you do. For example when you go to the home page you will see &ref=logo or &ref=home in the URL depending on which link you clicked on. Facebook even attaches your user id to the url when you view another user's photos. This means they can find all the hotties that people look at pictures of the most, but that is a story for another time.
So you might wonder where I am going with this... On this site I set it up so blog comments are posted and retrieved with AJAX calls. This means the page doesn't have to refresh when you post a comment. Everything seemed great until I tried posting a comment on Internet Explorer. No matter how many times I refreshed the page I couldn't get my comment to show up. Does this mean it isn't being added to the database? Does this mean the AJAX call is not firing? No and no. What this means is that Internet Explorer caches AJAX requests made using GET.
For many things this would be fine like a page that is all static content, but for something like blog comments they are changing all the time (not on this site, however) this is unacceptable.
So there are a few ways to solve this problem including changing all requests to be POST. I opted to pass the current timestamp along in the URL. This tricks Internet Explorer into thinking that it is a page that has never been accessed before and you will receive the correct response :).
Here is the code (note I use JQuery for all my javascripts):
getComments : function()
{
var timestamp = new Date().getTime();
$.get(wwwUrl + "/ajax/blog/get-comments?blogId=" +
this.id + "×tamp=" + timestamp, function(html) {
$("#comments").html(html);
});
}
{
var timestamp = new Date().getTime();
$.get(wwwUrl + "/ajax/blog/get-comments?blogId=" +
this.id + "×tamp=" + timestamp, function(html) {
$("#comments").html(html);
});
}
As you can see it is super simple. new Date().getTime(); returns the current UNIX timestamp in milliseconds so we get up to date comments! Go ahead and leave one to try it for yourself
0 comments