AJAX as you might be knowing stands for Asynchronous JavaScript and XML, but in this article we are going to see what is the difference between Asynchronous and Synchronous AJAX call ? Let’s see how an AJAX call is made from client and what it involves.
- An object of the browser’s XML HTTP Request is created and a request is sent to a particular URL with some data either via POST or GET method.
- The request is processed and the response is returned by the server.
- Using JavaScript this response is then show on the browser or is used as per the requirement.
Both Asynchronous or Synchronous AJAX requests involve the same process of making the request and getting the response from the server. The only difference is that in an Asynchronous request the process is handled independently and is not dependent on following processes. So that the script do not wait for the server request to complete before executing the remaining lines of code. As soon as the server response is completed it is sent back to the client, but during the complete round-trip the client is not halted.
However in case of Synchronous AJAX request, the request is sent to the server and the client waits for the server’s response before it executes the script further. So this is the special case when the further script is dependent on the results returned by the server.
How do we make these requests?
It is very simple to set what type of AJAX request you want to make. All you need to do is pass true or false while sending the request. Look the code snippet below to see how it is done.
function pullAJAX() { var obj; obj = new XMLHttpRequest(); obj.onreadystatechange = function() { if(obj.readyState == 4) { //process the response } } //true - makes the Asynchronous AJAX request, false makes it Synchronous obj.open("POST", "myscript.php", true); obj.send(null); } |
In the above lines of code the open function accepts three parameters, they are :
First param, is the request method which can be POST or GET
Second param, is the script name on the server.
Third param, is responsible for changing AJAX request to Asynchronous or Synchronous. If we pass it true then the AJAX request is made asynchronous, however if passed false it is a synchronous request.
Hope this clarifies the difference between the two. Now it depends upon the scenario as to what AJAX request is needed.
Stay Digified !!
Sachin Khosla