In an effort to make client-side code as unobtrusive as possible, we
typically take the approach of first building applications without
JavaScript. This practice makes sure all of our anchor tags have
legitimate URLs in their href attribute. We can then attached event
handlers to the anchors that should trigger AJAX requests. Then it’s
simply a matter of reading the href attribute of the clicked item, and
setting that as the source for the AJAX request. Nothing new here…
$('a.trigger').click(function(){
var src = $(this).attr('href');
//AJAX request here
return false;
});
var src = $(this).attr('href');
//AJAX request here
return false;
});
But often we want to fork our controller logic based on whether or not a request was made via AJAX. For example, no reason getting data we won’t be using in the AJAX response (like navigations, user data, etc). Plus we want to load AJAX-specific views to return appropriate HTML snippets, or JSON objects.
So we just test to see if $_SERVER['HTTP_X_REQUESTED_WITH'] equals “xmlhttprequest” which seems to work consistently for all of the browsers on our checklist (note, this is sent when an AJAX request is made via jQuery – and most other JavaScript frameworks – but best not to assume). We set this as a constant in our bootstrap file, allowing us to refer to it throughout our code.
define('IS_AJAX', isset($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest');
One issue this brought up though was caching of AJAX requests,
especially in Internet Explorer. When updating our HTML with the
server’s response, we often saw the entire page load into the target
div. IE was aggressively caching the AJAX request. Simply setting
JQuery to disable caching was the easy fix.
$.ajaxSetup({ cache: false });
Another simple approach would be to add a parameter to all of your AJAX
requests. And even though the method outlined above is not tamper proof
(not that anything really is), it seems a bit more reliable to me than
the AJAX parameter approach, especially when you have many hands in the
jar during the application development cycle.
For more complex
application development, the majority of PHP frameworks out there
provide this via other means (CakePHP’s RequestHandler for example).
But for our home-baked, lightweight Facebook Application frameworks,
this works nicely.
0 comments:
Post a Comment