ایجاکس - XMLHttpRequest

شیء XMLHttpRequest برای تبادل داده‌ها با سرور استفاده می‌شود.

درخواست به سرور ارسال کنید

برای ارسال درخواست به سرور، ما از شیء XMLHttpRequest استفاده می‌کنیم open() و send() روش:

xhttp.open("GET", "ajax_info.txt", true);
xhttp.send();
xhttp.send("fname=Bill&lname=Gates"); طریقہ
open(method, url, asyncsetRequestHeader(

نوع درخواست را مشخص می‌کند

  • method: نوع درخواست: GET یا POST
  • url: موقعیت سرور (فایل)
  • async: true (آزادانه) یا false (همزمان)
send() درخواست به سرور ارسال کنید (برای GET استفاده می‌شود)
send(stringsetRequestHeader( درخواست به سرور ارسال کنید (برای POST استفاده می‌شود)

GET یا POST؟

GET ساده‌تر و سریع‌تر از POST است و می‌توان از آن در بیشتر موارد استفاده کرد.

اما، در موارد زیر همیشه از POST استفاده کنید:

  • فایل‌های ذخیره شده گزینه نیستند (به‌روزرسانی فایل‌ها یا پایگاه داده‌های سرور)
  • ارسال داده‌های زیادی به سرور (POST بدون محدودیت اندازه)
  • ارسال ورودی کاربر (می‌تواند شامل کاراکترهای ناشناخته باشد)، POST قوی‌تر و امن‌تر از GET است

درخواست GET

درخواست GET ساده‌ای:

مثال

xhttp.open("GET", "demo_get.asp", true);
xhttp.send();

خود کا تجربہ کریں

در مثال بالا ممکن است یک نتیجه ذخیره شده را دریافت کنید. برای جلوگیری از این موضوع، یک شناسه منحصر به فرد به URL اضافه کنید:

مثال

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 POST کنید، از طریق 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(

,

  • )اس پر 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);

غیر سینکھرن درخواست بھیجنا ویب ڈیولپرز کے لئے بہت بڑی ترقی ہے۔ سرور پر چلنے والی بہت سی کارروائیاں بہت کچھ وقت لیتے ہیں۔ ایجیکس قبل، اس آپریشن کا باعث اپلیکیشن رک یا رکاوٹ پڑ سکتا تھا。

غیر سینکھرن سے بھیجنا، جاوا اسکریپٹ سرور کا جواب ملنے کا انتظار نہیں کرتا، بلکہ

  • سرور کا جواب حاصل ہونے کی منتظرگی کے دوران دیگر اسکریپٹ چلائی جائیں
  • جب جواب تیار ہوجائیگا تو اس پر کارروائی کریں

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 استعمال کیا جاتا ہے تاکہ تیزی سے امتحان کیا جائے جاسکے، آپ بھی قدیمی جسٹاگرام کد میں سینکریو درخواست دیکھ سکتے ہیں۔

کابھی کد سروئر کی تکمیل کی توقع میں نہیں کی جاتی، لہذا onreadystatechange فانکشن کی ضرورت نہیں ہوتی:

مثال

xhttp.open("GET", "ajax_info.txt", false);
xhttp.send();
document.getElementById("demo").innerHTML = xhttp.responseText;

خود کا تجربہ کریں

ہم سینکریو XMLHttpRequest (async = false) کو نہیں منصوب کرتے، کیونکہ جسٹاگرام سروئر جواب کی توقع میں متوقف ہوجائے گا۔ اگر سروئر بوسیدار یا آهستا ہو تو، ایپلیکیشن بند ہوجائے گا یا متوقف ہوجائے گا۔

سینکریو XMLHttpRequest وائیب سٹینڈرڈ سے باہر کی جارہی ہے، لیکن یہ عمل میں بہت سا سال لگ سکتا ہے۔

مدرن ترقیاتی ابزاروں کو اس لئے انتباہ دیا جاتا ہے کہ وہ سینکریو پارچج کا استعمال کریں، جب یہ صورت پیش آئی تو، InvalidAccessError جسٹاگرام کا استثنائی درج کیا جاسکتا ہے۔