سؤال

لقد رأيت مثالاً بسيطًا لأكواد مصدر Ajax في العديد من البرامج التعليمية عبر الإنترنت.ما أريد معرفته هو ما إذا كان استخدام الكود المصدري في الأمثلة جيدًا أم لا؟

هل هناك أي شيء آخر يمكن إضافته إلى الكود الذي يدخل في تطبيق العالم الحقيقي؟

ما هي الخطوات التي يجب اتخاذها لجعل التطبيق أكثر قوة وأمانًا؟

فيما يلي نموذج التعليمات البرمجية المصدر الذي حصلت عليه من الويب:

function getChats() {
    xmlHttp=GetXmlHttpObject();
    if (xmlHttp==null) {
            return;
    } 
    var url="getchat.php?latest="+latest;   
    xmlHttp.onreadystatechange=stateChanged;
    xmlHttp.open("GET",url,true);
    xmlHttp.send(null);
} 

function GetXmlHttpObject() {
    var xmlHttp=null;
    try {
            xmlHttp=new XMLHttpRequest();
    } catch (e) {
            try {
                    xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
            } catch (e) {
                    xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
            }
    }
    return xmlHttp;
}
هل كانت مفيدة؟

المحلول

يفتقد الكود الذي نشرته عنصرًا مهمًا واحدًا:تم تغيير حالة الوظيفة.

إذا لم تفهم تمامًا الكود الذي نشرته بنفسك، فإن ما يحدث هو عند اكتمال الاتصال بـ getchats.php، يتم استدعاء وظيفة "stateChanged" وستكون هذه الوظيفة مسؤولة عن التعامل مع الاستجابة.نظرًا لأن البرنامج النصي الذي تتصل به والدالة نفسها مسبوقة بكلمة "gets"، فأنا متأكد تمامًا من أن الاستجابة هي شيء ستثير اهتمامك.

وبغض النظر عن ذلك، هناك عدد من الطرق لتحسين الكود الذي نشرته.أعتقد أنه يعمل عن طريق الإعلان عن كائن "xmlHttp" واحد ثم جعله متاحًا لكل وظيفة (لأنه إذا لم يحدث ذلك، فلن يكون لدى الدالةstateChanged أي طريقة للحصول على الاستجابة).يعد هذا أمرًا جيدًا حتى تقوم بتشغيل طلب AJAX قبل عدم الرد على آخر طلب (أو آخر عدد قليل) بعد، وفي هذه الحالة تتم الكتابة فوق مرجع الكائن إلى الطلب الأخير في كل مرة.

بالإضافة إلى ذلك، فإن أي كود AJAX يستحق ذلك يوفر وظيفة لحالات النجاح والفشل (أخطاء الخادم، عدم العثور على الصفحة، وما إلى ذلك) بحيث يمكن تسليم الرسالة المناسبة للمستخدم.

إذا كنت تريد فقط استخدام وظيفة AJAX على موقع الويب الخاص بك، فسأوجهك في اتجاه مسج أو أ مشابه نطاق.

ولكن إذا كنت تريد حقًا فهم التكنولوجيا وما يحدث خلف الكواليس، فسأستمر في فعل ما تفعله وطرح أسئلة محددة أثناء محاولتك إنشاء فصل AJAX صغير وخفيف الوزن بنفسك.هذه هي الطريقة التي فعلت بها ذلك، وعلى الرغم من أنني أستخدم إطار عمل jQuery اليوم..ما زلت سعيدًا لأنني أعرف كيف يعمل الأمر خلف الكواليس.

نصائح أخرى

سأستخدم إطارًا مثل DOMAsistant والذي قام بالفعل بالعمل الشاق من أجلك وسيكون أكثر قوة بالإضافة إلى إضافة ميزات مفيدة إضافية.

وبصرف النظر عن ذلك، يبدو أن التعليمات البرمجية الخاصة بك ستؤدي المهمة.

أوصي بصراحة باستخدام إحدى المكتبات العديدة المتاحة لـ Ajax.أنا أستعمل النموذج المبدئي نفسي، بينما يفضل الآخرون مسج.أنا أحب النموذج الأولي لأنه بسيط جدًا.ال البرنامج التعليمي للنموذج اياكس يشرح ذلك جيدا.كما يسمح لك بالتعامل مع الأخطاء بسهولة.

new Ajax.Request('/some_url',
  {
    method:'get',
    onSuccess: function(transport){
      var response = transport.responseText || "no response text";
      alert("Success! \n\n" + response);
    },
    onFailure: function(){ alert('Something went wrong...') }
  });
مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top