AJAX in Hindi : Server Response

AJAX Server Response

  • Introduction to AJAX server response in Hindi
  • AJAX Server response properties in Hindi
  • AJAX Server response methods in Hindi

Introduction to AJAX Server Response

AJAX में server से response की process traditional web model से अलग है। Traditional model में जँहा response web browser में directly load हो जाता है, वँही AJAX response प्राप्त करने के लिए आप responseText  और responseXML जैसी properties use करते है।

XMLHttpRequest object की readyState property इसके status को दर्शाती है। जब इस property का status 4 होता है तो यह दर्शाता है की response ready है। XMLHttpRequest object के status को status और statusText जैसी properties से देखा जा सकता है। हालाँकि response प्राप्त करने के लिए status property को भी OK state में होना आवश्यक है।

Traditional web model से AJAX response model कई महत्वपूर्ण advantages provide करता है।
  1. AJAX के द्वारा response को बिना पुरे web page को load किये प्राप्त किया जा सकता है। 
  2. AJAX के द्वारा response JSON format में भी प्राप्त किया जा सकता है। 

Steps of AJAX Response 

AJAX response की process को निचे steps द्वारा समझाया जा रहा है।
  1. यदि request asynchronous है तो सबसे पहले onreadystatechange property में एक function define किया जाता है जो readyState change होने पर call होगा। 
  2. क्योंकि onreadystatechange property में define किया गया function हर बार status change होने पर call होगा। इसलिए इस function की शुरुआत में ये check किया जाएगा की क्या readyState 4 है? और क्या status OK है?
  3. Condition true होने पर DOM के साथ responseText और responseXML properties को use करते हुए response display करवाया जाता है। इसके लिए this object को use किया जाता है। 
  4. यदि request synchronous है तो function create करके condition check करने की कोई जरुरत नहीं होती है। 
  5. Synchronous request के case में XMLHttpRequest object से response display करवाया जाता है।  

AJAX Server Response Properties 

निचे AJAX server response के लिए use की जाने वाली properties के बारे में बताया जा रहा है। 

responseText Property 

Server के response को string के रूप में प्राप्त करने के लिए इस इस property को use किया जाता है। यदि request asynchronous है तो आप इसे function के अंदर DOM के साथ इस प्रकार use करेंगे।

<html>
<body>

<p id="Response"></p>

<script type="text/javascript">

//Creating & sending request

var xmlHttp = new XMLHttpRequest();
xmlHttp.open("GET","info.txt",true);
xmlHttp.send();

//End of request

//Getting response

xmlHttp.onreadystatechange = function()
{
     if(readyState==4 && status==200) //Checking for status
     {
           document.getElementById("Response").innerHTML = this.responseText;
     }
}

//End of response

</script>
</body>
</html>

यदि request synchronous है तो आप इसे directly इस प्रकार use करेंगे।


<html>
<body>

<p id="Response"

<script type="text/javascript">

//Creating & sending request
var xmlHttp = new XMLHttpRequest();
xmlHttp.open("GET","info.txt",false);
xmlHttp.send();
//End of request

//Getting response

document.getElementById("Response").innerHTML = X-H-RObject.responseText;

//End of response
  
</script>
</body>
</html>


responseXML Property

Server से XML के रूप में response प्राप्त करने के लिए आप इस property को use करते है। इस property को use करने के लिए सबसे महत्वपूर्ण बात आपको ये जाननी चाहिए की ये property एक XML DOM object return करती है। इस object के द्वारा ही आप information को display करवाते है। बाकी process responseText porperty की तरह ही है। इसका उदाहरण निचे दिया जा रहा है।

<html>
<body>

<p id="Response"></p>

<script type="text/javascript">

//Creating & sending request

var xmlHttp = new XMLHttpRequest();
xmlHttp.open("GET","info.txt",true);
xmlHttp.send();

//End of request

//Getting response

xmlHttp.onreadystatechange = function()
{
    if(readyState==4 && status==200)
    {
        var xmlDoc = xmlHttp.xmlResponse; //Getting XML object
        var res = xmlDoc.getElementByTagName("Name");
        var response = document.getElementById("Response").innerHTML = res;
    }
}

//End of response

</script>
</body>
</html>


AJAX Server Response Methods

AJAX server response में use किये जाने वाले methods के बारे में निचे दिया जा रहा है। 

getResponseHeader() Method 

यह method server response में से specific header information return करता है। उदाहरण के लिए आप जिस file को server से access कर रहे है उसके बारे में पता करना चाहते है की इसे last कब modify किया गया था। Asynchronous requests के case में इसे this object के साथ और synchronous request के case में इसे XMLHttpRequest object के साथ call की किया जाता है। इसे निचे उदाहरण के द्वारा समझाया जा रहा है। 

<html>
<body>

<p id="Response"></p>

<script type="text/javascript">

//Creating & sending request

var xmlHttp = new XMLHttpRequest();

xmlHttp.open("GET","info.txt",true);
xmlHttp.send();

//End of request

//Getting response

xmlHttp.onreadystatechange = function()
{
    if(readyState==4 && status==200)
    {
        document.getElementById("Response").innerHTML = this.getResponseHeader("Last-Modified");
    }
}

//End of response

</script>

</body>
</html>


getAllResponseHeaders()

यह method server response में से संपूर्ण header information को प्राप्त करने के लिए use किया जाता है। यह method length, server-type, content-type और last modified आदि information return करता है। इसका उदाहरण निचे दिया जा रहा है। 

document.getElementById("Response").innerHTML = this.getAllResponseHeader();

      DMCA.com Protection Status

 Leave a comment