AJAX پاسخ (AJAX Response)
وقتی از سرور جواب می آید، باید آن را بخوانیم. دو راه اصلی داریم: رشته ساده با responseText و شی XML با responseXML. همچنین می توانیم هدرهای پاسخ را بگیریم.
ویژگی های پاسخ سرور
responseText: پاسخ را به صورت رشته می دهد. برای گذاشتن متن در صفحه عالی است.
document.getElementById("demo").innerHTML = xhttp.responseText;
responseXML: پاسخ را به صورت XML DOM می دهد. می توانیم تگ ها را بخوانیم.
const xmlDoc = xhttp.responseXML;
const x = xmlDoc.getElementsByTagName("ARTIST");
let txt = "";
for (let i = 0; i < x.length; i++) {
txt += x[i].childNodes[0].nodeValue + "<br>";
}
document.getElementById("demo").innerHTML = txt;
xhttp.open("GET", "cd_catalog.xml");
xhttp.send();
متدهای پاسخ سرور
getAllResponseHeaders(): تمام هدرهای پاسخ را برمی گرداند.
const xhttp = new XMLHttpRequest();
xhttp.onload = function() {
document.getElementById("demo").innerHTML = this.getAllResponseHeaders();
};
xhttp.open("GET", "ajax_info.txt");
xhttp.send();
getResponseHeader(name): مقدار یک هدر مشخص را می دهد؛ مثلاً آخرین تغییر.
const xhttp = new XMLHttpRequest();
xhttp.onload = function() {
document.getElementById("demo").innerHTML = this.getResponseHeader("Last-Modified");
};
xhttp.open("GET", "ajax_info.txt");
xhttp.send();
گام های عملی خواندن پاسخ
- صبر کن تا درخواست کامل شود.
- برای متن، از responseText استفاده کن.
- برای XML، از responseXML استفاده کن.
- در صورت نیاز، هدرها را بررسی کن.
نکته: اگر JSON می گیری، سرور باید Content-Type مناسب بدهد. سپس رشته را با JSON.parse() تبدیل کن.
برای ارسال، به AJAX درخواست سر بزن. همچنین روش ساده تر در Fetch API توضیح داده شده است.
جمع بندی سریع
- responseText برای متن ساده است.
- responseXML برای داده ساخت یافته XML است.
- هدرها را با دو متد هدر بگیر.
- نمایش نتیجه را در DOM انجام بده.