ఏజాక్స్ - సర్వర్ రెస్పాంస్

కోర్సు ప‌రిశీల‌న‌:

readyState onreadystatechange అనునది ప్ర‌తిస్ప‌ంద‌న స్థితి ప్ర‌తిస్ప‌ందం

onreadystatechange ప్ర‌తిస్ప‌ంద‌న స్థితిని నిర్వ‌హిస్తుంది.

status ప్ర‌తిస్ప‌ంద‌న స్థితి మారితే అమ‌లు చేసే ఫంక్ష‌న్‌ను నిర్వ‌హిస్తుంది. హ్ట్ట్ప్ సందేశాల ప్ర‌మాణిక పుస్త‌కం ప్ర‌తిస్ప‌ంద‌న స్థితిని స్థిరప‌ర‌చుతుంది.

అంశం వివరణ
onreadystatechange ప్ర‌తిస్ప‌ంద‌న స్థితి మారితే అమ‌లు చేసే ఫంక్ష‌న్‌ను నిర్వ‌హిస్తుంది.
readyState

ప్ర‌తిస్ప‌ంద‌న స్థితిని నిర్వ‌హిస్తుంది.

  • సర్వ‌ర్ క‌నెక్ష‌న్ స్థితిని నిర్వ‌హిస్తుంది.
  • 0: అభ్య‌ర్థ‌న ప్రారంభం కాలేదు
  • 1: స‌ర్వ‌ర్ క‌నెక్ష‌న్ ఏర్పాటు అయింది
  • 2: అభ్య‌ర్థ‌న అందుకున్నది
  • 3: అభ్య‌ర్థ‌న ప్ర‌క్రియా అయింది
status
  • 4: అభ్య‌ర్థ‌న పూర్తి అయింది మ‌రియు ప్ర‌తిస్ప‌ందం సిద్ధం అయింది
  • 200: "OK"
  • 403: "Forbidden"

404: "Page not found" పూర్తి జాబితా కోసం సందర్శించండి
హ్ట్ట్ప్ సందేశాల ప్ర‌మాణిక పుస్త‌కం statusText

ప్ర‌తిస్ప‌ంద‌న స్థితి ప్ర‌తిస్ప‌ందంతో పునఃప్రారంభం అయింది (ఉదాహ‌ర‌ణకు "OK" లేదా "Not Found") ప్ర‌తిస్ప‌ంద‌న స్థితి మారితే

ప్ర‌తిస్ప‌ంద‌న స్థితి మారితే onreadystatechange ఫంక్ష‌న్‌ను కాల్‌చేస్తారు. readyState కోసం 4,status కోసం 200 ఈ స‌మ‌యంలో ప్ర‌తిస్ప‌ంద‌న సిద్ధం అయింది:

ఇన్స్టాన్స్

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

స్వయంగా ప్రయత్నించండి

పేర్కొనాలి:onreadystatechange మూడు సార్లు జ‌రిగింది (0-4), ప్ర‌తి సారి readyState మొత్తం మారుతుంది.

కాల్‌బ్యాక్ ఫంక్ష‌న్‌ను వాడటం

మ‌రొక ఫంక్ష‌న్‌కు పారామిట‌ర్‌గా పంపబ‌డే ఫంక్ష‌న్‌లు కాల్‌బ్యాక్ ఫంక్ష‌న్‌లు అని పిలుస్తారు.

మీ వెబ్‌సైట్‌లో అనేక AJAX కార్య‌క్ర‌మాలు ఉన్నట్లయితే, మీరు XMLHttpRequest ఆబ్జెక్ట్‌ను అమ‌లు చేసే ఫంక్ష‌న్‌ను మ‌రియు ప్ర‌తి అజెక్స్ కార్య‌క్ర‌మానికి కాల్‌బ్యాక్ ఫంక్ష‌న్‌ను సృష్టించ‌వ‌ల‌సి ఉంటుంది.

ఈ ఫంక్షన్‌లో 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();

స్వయంగా ప్రయత్నించండి