Saturday, December 11, 2010

XMLHttpRequest

Que: What is XMLHTTPRequest object?
Ans: XMLHttpRequest is an API available in web browser scripting language to make Ajax calls. It sends HTTP or HTTPS requests to web server and load server response. It is very important in web development technique.

Que: How to use XMLHTTPRequest in your script?
Ans: Here is code snippet which creates an XMLHTTPRequest:

if (type of XMLHttpRequest == "undefined")
  XMLHttpRequest = function () {
    try { return new ActiveXObject("Msxml2.XMLHTTP.6.0"); }
      catch (e) {}
    try { return new ActiveXObject("Msxml2.XMLHTTP.3.0"); }
      catch (e) {}
    throw new Error("This browser does not support XMLHttpRequest.");
};
var xmlhttp = new XMLHttpRequest();
xmlhttp.open("GET","http://www.abc.com",true);
xmlhttp.onreadystatechange = checkData;
xmlhttp.send(null);
function checkData()
{
    //Response received.
}

Que: What all different methods associated with XMLHTTPRequest object?
Ans:
-Open (“method”, “URL”, “asynchronous”, “username”, “pswd”)

method: HTTP request method to be used( GET,POST,HEAD,PUT,DELETE,OPTIONS)
URL: URL of HTTP request.
asynchronous: Call will be asynch or synch.
-username and pswd(optional): authentication and authorization.

-Send(args): Sends a request to the server resource.args can be anything which could be converted into string. if args is a DOM document object, a user agent should assure the document is turned into well-formed XML using the encoding indicated by the inputEncoding property of the document object.

-Onreadystatechange: is an event handler, which fires at every state(loading,loaded,completed etc.) change.

-Ready State: current state of the object.
0 = uninitialized
1 = loading(open method has been invoked successfully)
2 = loaded(send method has been invoked and the HTTP response headers have been received)
3 = interactive(HTTP response content begins to load)
4 = complete(HTTP response content has finished loading)

-getAllResponseHeaders(): Returns a collection of HTTP headers as string.

Que: what is synchronous and asynchronous request?
Ans: An asynch request ("true") will not wait on a server response before continuing on with the execution of the current script. It will instead invoke the onreadystatechange event listener of the XMLHttpRequest object throughout the various stages of the request. A synch request ("false") however will block execution of the current script until the request has been completed, thus not invoking the onreadystatechange event listener.

Que: What is difference between open and send method. Do we really need both to make a request?
Ans: open method only initializes the request but we need to use send() method to actually send that request to server side.

Que: How can we check whether URL is valid or not?
Ans: We can make use of readystate to check the response:
xmlhttp.open("HEAD", "http://www.abc.com",true);
 xmlhttp.onreadystatechange=function() {
  if (xmlhttp.readyState==4) {
   if (xmlhttp.status==200) alert("Got it right ")
    else if (xmlhttp.status==404) alert("URL doesn't exist!")
     else alert("Status got is:  "+xmlhttp.status)
  }
 }
 xmlhttp.send(null)

Que: How can we make a request to get only header?
Ans: here is code snippet to do so:
xmlhttp.open("HEAD", "http://www.abc.com",true);
 xmlhttp.onreadystatechange=function() {
  if (xmlhttp.readyState==4) {
   alert(xmlhttp.getAllResponseHeaders())
  }
 }
 xmlhttp.send(null);
If you want a specific header value, you can use getResponseHeader (“header name”);

No comments:

Post a Comment