يتم استخدام كائن XMLHttpRequest لتبادل البيانات مع الخادم.
لإرسال طلب إلى الخادم، نستخدم التابعين open() و send() للكائن XMLHttpRequest:
xmlhttp.open("GET"،"ajax_info.txt"،true)؛xmlhttp.send();
طريقة | يصف |
---|---|
فتح ( طريقة ، عنوان URL ، غير متزامن ) | يحدد نوع الطلب، وعنوان URL، وما إذا كان سيتم التعامل مع الطلب بشكل غير متزامن. الطريقة : نوع الطلب؛ url : موقع الملف على الخادم غير متزامن : صحيح (غير متزامن) أو خطأ (متزامن) |
إرسال ( سلسلة ) | أرسل الطلب إلى الخادم. السلسلة : تستخدم فقط لطلبات POST |
يعد GET أبسط وأسرع من POST ويعمل في معظم المواقف.
ومع ذلك، استخدم طلبات POST في المواقف التالية:
غير قادر على استخدام الملفات المخزنة مؤقتًا (تحديث الملفات أو قواعد البيانات على الخادم)
إرسال كميات كبيرة من البيانات إلى الخادم (POST ليس له حد لحجم البيانات)
يعد POST أكثر استقرارًا وموثوقية من GET عند إرسال إدخال المستخدم الذي يحتوي على أحرف غير معروفة
طلب الحصول على بسيط:
في المثال أعلاه، ربما تحصل على نتائج مخزنة مؤقتًا.
لتجنب ذلك، أضف معرفًا فريدًا إلى عنوان URL:
إذا كنت ترغب في إرسال معلومات عبر طريقة GET، أضف المعلومات إلى عنوان URL:
طلب POST بسيط:
إذا كنت بحاجة إلى نشر البيانات مثل نموذج HTML، فاستخدم setRequestHeader() لإضافة رؤوس HTTP. ثم حدد البيانات التي ترغب في إرسالها بطريقة الإرسال ():
طريقة | يصف |
---|---|
setRequestHeader ( رأس، قيمة ) | أضف رؤوس HTTP إلى الطلب. header : يحدد اسم الرأس value : تحدد قيمة الرأس |
معلمة url للطريقة open() هي عنوان الملف الموجود على الخادم:
xmlhttp.open ("GET"، "ajax_test.html"، true)؛
يمكن أن يكون الملف أي نوع من الملفات، مثل .txt و.xml، أو ملف نصي للخادم، مثل .asp و.php (والذي يمكنه تنفيذ المهام على الخادم قبل إرسال الاستجابة مرة أخرى).
يشير AJAX إلى JavaScript وXML غير المتزامنين.
إذا كان سيتم استخدام كائن XMLHttpRequest لـ AJAX، فيجب تعيين المعلمة غير المتزامنة لأسلوب open() الخاص به على true:
xmlhttp.open ("GET"، "ajax_test.html"، true)؛
بالنسبة لمطوري الويب، يعد إرسال الطلبات غير المتزامنة بمثابة تحسن كبير. العديد من المهام التي يتم تنفيذها على الخادم تستغرق وقتًا طويلاً. قبل AJAX، قد يتسبب هذا في تعليق التطبيق أو إيقافه.
مع AJAX، لا تحتاج JavaScript إلى انتظار استجابة من الخادم، ولكن بدلاً من ذلك:
قم بتنفيذ البرامج النصية الأخرى أثناء انتظار استجابة الخادم
قم بمعالجة الاستجابة عندما تكون جاهزة
عند استخدام async=true، حدد دالة ليتم تنفيذها استجابةً لحالة الاستعداد في حدث onreadystatechange:
ستتعلم المزيد عن تغيير حالة الاستعداد في فصل لاحق.
إذا كنت تريد استخدام async=false، فقم بتغيير المعلمة الثالثة في طريقة open() إلى false:
xmlhttp.open("GET"،"test1.txt"،false)؛
لا نوصي باستخدام async=false، ولكن بالنسبة لبعض الطلبات الصغيرة، يكون ذلك ممكنًا.
تذكر أن JavaScript تنتظر حتى تصبح استجابة الخادم جاهزة قبل المتابعة. إذا كان الخادم مشغولاً أو بطيئًا، فسيتوقف التطبيق أو يتوقف.
ملحوظة: عند استخدام async=false، لا تكتب دالة onreadystatechange - فقط ضع الكود بعد عبارة send():