ఏజాక్స్ - XMLHttpRequest
- ముందస్తు పేజీ ఏజాక్స్ XMLHttp
- తరువాత పేజీ ఏజాక్స్ ప్రతిస్పందన
XMLHttpRequest ఆబ్జెక్ట్ సర్వర్‌తో మార్పిడి చేయటానికి ఉపయోగించబడుతుంది.
సర్వర్‌కు అభ్యర్ధనలను పంపండి
సర్వర్‌కు అభ్యర్ధనలను పంపడానికి, XMLHttpRequest ఆబ్జెక్ట్ యొక్క open() మరియు send() పద్ధతి:
xhttp.open("GET", "ajax_info.txt", true);
xhttp.send();
| 方法 | 描述 |
|---|---|
| open(method, url, async) |
అభ్యర్ధనా రకాన్ని నిర్దేశించు
|
| send() | సర్వర్‌కు అభ్యర్ధనలను పంపండి (GET కొరకు ఉపయోగించబడుతుంది) |
| send(string) | సర్వర్‌కు అభ్యర్ధనలను పంపండి (POST కొరకు ఉపయోగించబడుతుంది) |
GET లేదా POST?
GET POST కంటే సరళమైనది మరియు అత్యంత వేగవంతమైనది, దానిని అత్యంత పరిస్థితుల్లో ఉపయోగించవచ్చు.
కానీ, ఈ పరిస్థితుల్లో ఎల్లప్పుడూ POST ఉపయోగించండి:
- క్యాచ్ ఫైల్స్ ఎంపిక కాదు (సర్వర్‌పై ఫైల్స్ లేదా డేటాబేస్ నవీకరించండి)
- సర్వర్‌కు ఎక్కువ డాటాను పంపండి (POST విస్తృత పరిమితి లేదు)
- వినియోగదారి ప్రవేశం (అజ్ఞాత అక్షరాలను సహిస్తుంది), POST GET కంటే బలమైనది మరియు సురక్షితమైనది
GET అభ్యర్ధనలు
ఒక సాధారణ GET అభ్యర్ధనలు:
ఇన్స్టాన్స్
xhttp.open("GET", "demo_get.asp", true);
xhttp.send();
పైన ఉన్న ఉదాహరణలో, మీరు క్యాచ్‌లు పొందవచ్చు. ఈ పరిస్థితిని తప్పించడానికి, ఒక ప్రత్యేకమైన ఐడి చేర్చండి:
ఇన్స్టాన్స్
xhttp.open("GET", "demo_get.asp?t=" + Math.random(), true);
xhttp.send();
మీరు GET పద్ధతిని ఉపయోగించి సందేశాలను పంపాలనుగా ఉంటే, ఈ సమాచారాన్ని URL కు జోడించండి:
ఇన్స్టాన్స్
xhttp.open("GET", "demo_get2.asp?fname=Bill&lname=Gates", true);
xhttp.send();
POST అభ్యర్ధనలు
ఒక సాధారణ POST అభ్యర్ధనలు:
ఇన్స్టాన్స్
xhttp.open("POST", "demo_post.asp", true);
xhttp.send();
మీరు HTML ఫారమ్‌లాంటో పోస్ట్ డాటా పంపాలనుగా ఉంటే, ఈ ద్వారా చేయండి: setRequestHeader() ఒక HTTP హెడర్‌ను జోడించండి. దయచేసి ఈ ప్రకారం చేయండి: send() మాథ్యమ్‌లో మీరు పంపాల్సిన డాటా నిర్దేశించబడింది:
ఇన్స్టాన్స్
xhttp.open("POST", "ajax_test.asp", true);
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhttp.send("fname=Bill&lname=Gates");
| 方法 | 描述 |
|---|---|
| setRequestHeader(header, value) |
向请求添加 HTTP 头部
|
url - 服务器上的文件
open() 方法的 url 参数，是服务器上文件的地址：
xhttp.open("GET", "ajax_test.asp", true);
该文件可以是任何类型的文件，如 .txt 和 .xml，或服务器脚本文件，如 .asp 和 .php（它们可以在发送回响应之前在服务器执行操作）。
异步 - true 还是 false？
如需异步发送请求，open() 方法的 async 参数必须设置为 true：
xhttp.open("GET", "ajax_test.asp", true);
发送异步请求对 web 开发人员来说是一个巨大的进步。服务器上执行的许多任务都非常耗时。在 AJAX 之前，此操作可能会导致应用程序挂起或停止。
通过异步发送，JavaScript 不必等待服务器响应，而是可以：
- 在等待服务器响应时执行其他脚本
- ప్రతిస్పందన సమర్ధంగా ఉన్నప్పుడు ప్రతిస్పందనను నిర్వహించడం
onreadystatechange అనునది పరిమితి
XMLHttpRequest ఆబ్జెక్ట్ ద్వారా, మీరు అభ్యర్థన అనుభవించినప్పుడు అమలు చేయవలసిన ఫంక్షన్ను నిర్వచించవచ్చు.
ఈ ఫంక్షన్ XMLHttpResponse ఆబ్జెక్ట్ లో ఉంది. onreadystatechange అనునది స్పష్టంగా నిర్వచించబడింది పరిమితిలో:
ఇన్స్టాన్స్
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 గురించి మరింత తెలుసుకోవచ్చు.
అనుసంధానం అభ్యర్థన
అనుసంధానం అనే అభ్యర్థనను అమలు చేయడానికి, దయచేసి ఈ విధంగా చేయండి: open() 方法中的第三个参数设置为 false：
xhttp.open("GET", "ajax_info.txt", false);
有时 async = false 用于快速测试。你也会在更老的 JavaScript 代码中看到同步请求。
由于代码将等待服务器完成，所以不需要 onreadystatechange 函数：
ఇన్స్టాన్స్
xhttp.open("GET", "ajax_info.txt", false);
xhttp.send();
document.getElementById("demo").innerHTML = xhttp.responseText;
సింక్రనస్ XMLHttpRequest (async = false) ని మానికించను, ఎందుకంటే జావాస్క్రిప్ట్ సర్వర్ ప్రతిస్పందం సిద్ధం వరకు అనుభవించబడుతుంది. సర్వర్ బిగిని లేదా వేగంగా ఉన్నప్పుడు, అప్లికేషన్ హాంగ్ అయ్యేది లేదా ఆగేది.
సింక్రనస్ XMLHttpRequest వెబ్ ప్రమాణాల నుండి తీసివేయబడుతున్నది, కానీ ఈ ప్రక్రియ అనేక సంవత్సరాలు పట్టవచ్చు.
సింక్రనస్ ఏజాక్స్ రీక్వెస్ట్స్ అనేకసార్లు అభిప్రాయం పరిమితం చేయబడ్డాయి, మరియు ఈ సంగతి జరగజేసినప్పుడు InvalidAccessError అపఘాతం విస్ఫోటం జరగవచ్చు.
- ముందస్తు పేజీ ఏజాక్స్ XMLHttp
- తరువాత పేజీ ఏజాక్స్ ప్రతిస్పందన
