एकाधिक AJAX अनुरोधों को प्रबंधित करने का सही तरीका क्या है?

Question

हमने सभी को AJAX ट्यूटोरियल में कुछ उदाहरण देखे हैं जहां कुछ डेटा भेजा जाता है। वे सभी (कम या ज्यादा) की तरह लग रहे:

var http = createRequestObject(); // shared between printResult() and doAjax() 

function createRequestObject() { /* if FF/Safari/Chrome/IE ... */ ... } 

function printResult() 
{ 
    if (http.readyState == 4) { ... } 
} 

function doAjax() { 
    var request = 'SomeURL'; 
    http.open('post', request); 
    http.onreadystatechange = printResult; 
    data = ...; // fill in the data 
    http.send(data); 
} 

// trigger doAjax() from HTML code, by pressing some button 

यहाँ परिदृश्य मैं पूरी तरह से समझ में नहीं आता: क्या हुआ अगर बटन कई बार बहुत तेजी से दबाया जा रहा है? AJAX() किसी भी तरह से http ऑब्जेक्ट को फिर से शुरू करना चाहिए? और यदि वस्तु फिर से शुरू की जाती है, तो अनुरोधों के साथ क्या होता है जो पहले से ही हवा पर हैं?

पीएस: मॉडरेटर के लिए: यह प्रश्न शायद अधिक समुदाय-विकी से संबंधित है। जैसा कि यहां बताया गया है (https://meta.stackexchange.com/questions/67581/community-wiki-checkbox-missing-in-action) - अगर मुझे यह सही मिला है - कृपया इस सवाल को उचित रूप से चिह्नित करें।

Answer 1

सुनिश्चित करें कि आजकल कई पुस्तकालय मौजूद हैं जो सभ्य नौकरी करते हैं और उत्पादन वातावरण में उपयोग किए जाने चाहिए। हालांकि, मेरा सवाल अंडर-द-हूड विवरणों के बारे में था। तो यहां मुझे प्रति अनुरोध समर्पित अनुरोध ऑब्जेक्ट्स रखने के लिए लैम्डा-कैलकुस-जैसा तरीका मिला है।

function printResult(http) { 
    if (http.readyState == 4) { ... } 
    ... 
} 

function doAjax() { 
    var http = createRequestObject();  
    var request = 'SomeURL'; 

    http.open('get', request);  
    http.onreadystatechange = function() { printResult(http); }; 
    http.send(null); 
    return false; 
} 

सफलतापूर्वक क्रोम और IE9 के तहत परीक्षण किया: उन वस्तु जाहिर कॉलबैक फ़ंक्शन जो जब प्रतिक्रिया आता है आदि कहा जाता है को दे दिया जाएगा।

Answer 2

मैंने इस परिदृश्य से निपटने के लिए प्रति पृष्ठ अनुरोध कतार का उपयोग किया है (डुप्लिकेट अनुरोधों को दबाने और अनुरोधों के अनुक्रमिक आदेश को सुनिश्चित करने के लिए), लेकिन एक और मानकीकृत समाधान हो सकता है।

चूंकि यह डिफ़ॉल्ट रूप से प्रदान नहीं किया गया है, इसलिए आपको इसे अपने पृष्ठ (या एक लिंक्ड स्क्रिप्ट) के भीतर जावास्क्रिप्ट में कार्यान्वित करने की आवश्यकता होगी। अजाक्स अनुरोध शुरू करने के बजाय, एक बटन पर क्लिक करने से कतार में एक अनुरोध जोड़ा जाएगा। यदि कतार खाली है, तो अजाक्स अनुरोध निष्पादित करें, कॉलबैक के साथ जो पंक्तिबद्ध प्रविष्टि को हटा देता है और अगले (यदि कोई हो) निष्पादित करता है।

यह भी देखें: How to implement an ajax request queue using jQuery

Answer 3

के बाद से AJAX प्रकृति asynchronus है, प्रत्येक बटन के साथ क्लिक आप async घटना है कि कुछ डेटा मिलेगा/पद से/सर्वर से उठाएंगे। आप एक कॉलबैक प्रदान करते हैं, इसलिए यह सर्वर को प्रोसेसिंग डेटा समाप्त होने पर कई बार ट्रिगर किया जाएगा।

डिफ़ॉल्ट रूप से यह सामान्य व्यवहार है, आपको http ऑब्जेक्ट को पुन: प्रारंभ नहीं करना चाहिए। यदि आप एकाधिक प्रेषण ऑपरेशन प्रस्तुत करना चाहते हैं तो आपको इसे मैन्युअल रूप से करना होगा (उदा। बटन को पहले कॉल के रूप में अक्षम करना)।

मैं भी jQuery $ .ajax का उपयोग करने का सुझाव देता हूं क्योंकि यह इन विवरणों में से कई को शामिल करता है।