How to force a program to wait until an HTTP request is finished in JavaScript? How to force a program to wait until an HTTP request is finished in JavaScript? javascript javascript

How to force a program to wait until an HTTP request is finished in JavaScript?


There is a 3rd parameter to XmlHttpRequest's open(), which aims to indicate that you want the request to by asynchronous (and so handle the response through an onreadystatechange handler).

So if you want it to be synchronous (i.e. wait for the answer), just specify false for this 3rd argument.You may also want to set a limited timeout property for your request in this case, as it would block the page until reception.

Here is an all-in-one sample function for both sync and async:

function httpRequest(address, reqType, asyncProc) {  var req = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP");  if (asyncProc) {     req.onreadystatechange = function() {       if (this.readyState == 4) {        asyncProc(this);      }     };  } else {     req.timeout = 4000;  // Reduce default 2mn-like timeout to 4 s if synchronous  }  req.open(reqType, address, !(!asyncProc));  req.send();  return req;}

which you could call this way:

var req = httpRequest("http://example.com/aPageToTestForExistence.html", "HEAD");  // In this example you don't want to GET the full page contentsalert(req.status == 200 ? "found!" : "failed");  // We didn't provided an async proc so this will be executed after request completion only


You can perform a synchronous request. jQuery example:

$(function() {    $.ajax({       async: false,       // other parameters    });});

You should take a look at jQuery's AJAX API. I highly recommend using a framework like jQuery for this stuff. Manually doing cross-browser ajax is a real pain!


You can use XMLHttpRequest object to send your request. Once request is sent, you can check readyState property to identify current state. readyState will have following different states.

  • Uninitialized - Has not started loading yet
  • Loading - Is loading
  • Interactive - Has loaded enough and the user can interact with it
  • Complete - Fully loaded

for example:

xmlhttp.open("GET","somepage.xml",true);xmlhttp.onreadystatechange = checkData;xmlhttp.send(null);function checkData(){    alert(xmlhttp.readyState);}

hope this will help