एज़ैक्स - सर्वर रिस्पांस

onreadystatechange गुण

अवस्था गुण XMLHTTPRequest की स्थिति रखता है。

onreadystatechange गुण रेडी स्टेट बदलने पर चलाने वाले फ़ंक्शन को निर्धारित करता है。

स्थिति गुण और Http संदेश संदर्भ मानचित्र गुण XMLHTTPRequest के रूप में

गुण वर्णन
onreadystatechange गुण XMLHTTPRequest ऑब्जेक्ट की स्थिति रखता है。
अवस्था

जब readyState गुण परिवर्तन होने वाले तो बुलाया जाने वाला फ़ंक्शन निर्धारित करता है。

  • XMLHttpRequest की स्थिति सहेजी गई
  • 0: अनुरोध निर्मित नहीं है
  • 1: सर्वर कनेक्शन स्थापित हो गया
  • 2: अनुरोध स्वीकार कर लिया गया
  • 3: अनुरोध शुरू हो रहा है
स्थिति
  • 4: अनुरोध पूरा हो गया और जवाब तैयार है
  • 200: "OK"
  • 403: "Forbidden"

404: "Page not found" पूर्ण सूची के लिए, यहाँ देखें
Http संदेश संदर्भ मानचित्र statusText

जवाब की स्थिति टेक्स्ट वापस करता है (उदाहरण के लिए "OK" या "Not Found") हर बार

जब रेडी स्टेट बदलता है तो onreadystatechange फ़ंक्शन बुलाया जाता है。 अवस्था इसके लिए 4साथ हीस्थिति इसके लिए 200 जब जवाब तैयार हो जाता है:

इंस्टांस

function loadDoc() {
    var xhttp = new XMLHttpRequest();
    xhttp.onreadystatechange = function() {
        if (this.अवस्था == 4 && this.स्थिति == 200) {
            document.getElementById("demo").innerHTML =
            this.responseText;
       }
    };
    xhttp.open("GET", "ajax_info.txt", true);
    xhttp.send(); 
}

अपने आप प्रयास करें

टिप्पणी:onreadystatechange पांच बार ट्रिगर होता है (0-4), हर बार अवस्था सभी बदल गए。

कॉलबैक फ़ंक्शन का उपयोग

कॉलबैक फ़ंक्शन एक फ़ंक्शन है जो दूसरे फ़ंक्शन के रूप में पारामीटर के रूप में पास किया जाता है。

अगर आपके वेबसाइट में कई AJAX कार्य हैं, तो आपको XMLHttpRequest ऑब्जेक्ट को चलाने वाला एक फ़ंक्शन और प्रत्येक AJAX कार्य के लिए एक कॉलबैक फ़ंक्शन बनाना चाहिए。

इस फ़ंक्शन में URL और जब उत्तरदायी होने लगे तो फ़ंक्शन को बुलाया जाना चाहिए।

इंस्टांस

loadDoc("url-1", myFunction1);
loadDoc("url-2", myFunction2);
function loadDoc(url, cFunction) {
  var xhttp;
  xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
      cFunction(this);
    }
  };
  xhttp.open("GET", url, true);
  xhttp.send();
}
function myFunction1(xhttp) {
  // यहाँ कार्य करें
 } 
function myFunction2(xhttp) {
  // यहाँ कार्य करें
 }

अपने आप प्रयास करें

सर्वर उत्तरदायी गुण

गुण वर्णन
responseText शब्दकोश रूप के उत्तरदायी डाटा प्राप्त करें
responseXML XML डाटा रूप के उत्तरदायी डाटा प्राप्त करें

सर्वर उत्तरदायी तरीका

तरीका वर्णन
getResponseHeader() सर्वर से विशेष शीर्षक जानकारी वापस करता है
getAllResponseHeaders() सर्वर से सभी शीर्षक जानकारी वापस करता है

responseText गुण

responseText गुण के रूप में सर्वर उत्तरदायी को JavaScript शब्दकोश के रूप में वापस करता है, इसलिए आप इस तरह इसे इस्तेमाल कर सकते हैं:

इंस्टांस

document.getElementById("demo").innerHTML = xhttp.responseText;

अपने आप प्रयास करें

responseXML गुण

XML HttpRequest ऑब्जेक्ट का एक बीच विश्लेषक है。

ResponseXML गुण के रूप में XML DOM ऑब्जेक्ट वापस सर्वर उत्तरदायी।

इस गुण का उपयोग करके, आप उत्तरदायी को XML DOM ऑब्जेक्ट के रूप में बदल सकते हैं。विश्लेषणXML DOM ऑब्जेक्ट के लिए:

इंस्टांस

अनुरोध फ़ाइल music_list.xmlऔर उत्तरदायी को विश्लेषित करें:

xmlDoc = xhttp.responseXML;
txt = "";
x = xmlDoc.getElementsByTagName("ARTIST");
for (i = 0; i < x.length; i++) {
  txt += x[i].childNodes[0].nodeValue + "<br>";
  }
document.getElementById("demo").innerHTML = txt;
xhttp.open("GET", "music_list.xml", true);
xhttp.send();

अपने आप प्रयास करें

आप इस ट्यूटोरियल के DOM चाप में XML DOM के बारे में अधिक जानेंगे。

getAllResponseHeaders() विधि

getAllResponseHeaders() विधि सर्वर जवाब से आने वाली सभी शीर्षक सूचना देती है。

इंस्टांस

var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
  if (this.readyState == 4 && this.status == 200) {
    document.getElementById("demo").innerHTML = this.getAllResponseHeaders();
  }
};

अपने आप प्रयास करें

getResponseHeader() विधि

getResponseHeader() विधि सर्वर जवाब से आने वाली विशिष्ट शीर्षक सूचना देती है。

इंस्टांस

var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
  if (this.readyState == 4 && this.status == 200) {
    document.getElementById("demo").innerHTML = this.getResponseHeader("Last-Modified");
  }
};
xhttp.open("GET", "ajax_info.txt", true);
xhttp.send();

अपने आप प्रयास करें