2010-05-08 14 views
8

मेरे पास लंबे समय तक चलने वाला कार्य है जिसे jquery AJAX का उपयोग करके बुलाया जाता है। मैं block ui plugin to show "लोडिंग" का उपयोग कर रहा हूं। क्या वैसे भी मैं प्रगति दिखाने के लिए क्लाइंट को प्रगति संदेश भेज सकता हूं और ब्लॉक ui प्लगइन संदेश पर अपडेट किया गया है।क्या jQuery AJAX में प्रगति अद्यतन घटनाएं हैं?

तो यह यह दिखाएगा (जैसा सर्वर सर्वर करता है)। ।

"पहले स्रोत लोड हो रहा है।।।"
"दूसरा स्रोत लोड हो रहा है।।।"
"तीसरी स्रोत लोड हो रहा है।।।"
"पार्सिंग परिणाम।।।"

+0

सी #, जावा, PHP .. आदि? –

+0

मेरा सर्वरसाइड सी # है, लेकिन मुझे लगता है कि उत्तर में अलग-अलग बैक एंड भाषा – leora

+0

दिए गए कोई अंतर नहीं होगा उत्तर -> 'लंबे समय तक चलने वाला कार्य' क्लाइंट साइड या सर्वर पक्ष निष्पादित किया जाता है? –

उत्तर

11

क्या से मैं अपलोड सामग्री के मामले के लिए देखा गया है - लोग एक अलग गेटवे बनाते हैं और इसे प्रगति जानकारी के लिए पूछते हैं क्योंकि यह सर्वर की तरफ केवल उपलब्ध है। लेकिन मुझे लगता है कि यह आपके मामले में सबसे अच्छी बात नहीं है।

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

यह काफी मेरे लिए एक खोज थी;)

[संपादित करें]

वर्तमान में बेहतर तकनीक के बहुत सारे उपलब्ध हैं, और उन सभी को में Socket.IO ऊपर लपेट कर रहे हैं - सहित अन्य तकनीकों के लिए फ़ॉलबैक साथ WebSockets http स्ट्रीमिंग

सॉकेट.आईओ नोडजेएस के लिए एक मॉड्यूल है, लेकिन अन्य और समान कार्यान्वयन भी हैं। मैंने पहले से ही https://github.com/Atmosphere/atmosphere

+0

पर दिया गया है 2 लिंक दोनों उत्कृष्ट हैं। – Doug

+0

पहला लिंक – bottleboot

+0

नीचे इंगित करने के लिए धन्यवाद है। मैंने पोस्ट में इस्तेमाल किए गए संसाधनों को कुछ और अद्यतित सामग्री में बदल दिया। – naugtur

1

से कुछ पैकेट का आदान-प्रदान किया है, मैं हाल ही में एक परियोजना के बारे में जागरूक हूं जो AJAX "पुश" करता है। के रूप में मैं जानता हूँ कि वहाँ कुछ अन्य परियोजनाओं के समान काम करने देखते हैं जहाँ तक

http://www.ape-project.org/

, इस सच्चा है:: आप इसे बाहर की जाँच करने के लिए चाहते हो सकता है "प्रगति संदेश वापस ग्राहक को भेजें" जहां अन्य समाधान के लिए प्रगति के लिए मतदान के अनुरोध की आवश्यकता है (अभी भी एक बहुत ही वैध और अच्छा समाधान)।

+0

यह प्रोजेक्ट http स्ट्रीमिंग का उपयोग करता है और मेरे द्वारा दिए गए दूसरे लिंक में दूसरों के बीच जुड़ा हुआ है।फिर भी एप-प्रोजेक्ट http स्ट्रीमिंग के लिए एक सी ++ सर्वर है और इसे एक प्रोग्रेसबार करने के लिए उपयोग करना मेरे लिए काफी अधिक है। – naugtur

1

मैं हर AJAX अनुरोध एक JSON संदेश, डेटा, और अनुरोध करने के लिए अगले URL को शामिल प्रतिक्रिया वापस होते हैं: अपना पहला AJAX अनुरोध करने से पहले {message: "Loading second resource...", data: ..., next_url: "/next_part"}

, BlockUI संदेश के लिए सेट "लोड हो रहा है ..." । जब आपको प्रतिक्रिया मिलती है, तो ब्लॉकयूआई संदेश को उस संदेश पर सेट करें जिसे आप अपने AJAX कॉल से वापस प्राप्त करते हैं। फिर अगली AJAX कॉल को "next_url" के मान पर बनाएं, और इसी तरह, जब तक आप सभी कार्यों को पूरा नहीं कर लेते हैं तब तक लूपिंग करें।

यदि आप एक बड़ा डेटा सेट लोड कर रहे हैं, लेकिन टुकड़ों में, आप progressive loading design pattern जैसे कुछ करना चाहते हैं, लेकिन प्रत्येक प्रतिक्रिया प्राप्त करते समय एक प्रगति संदेश भी सेट करें।

4

एक तरीका है jQuery हैंडलर और AJAX का उपयोग jQuery के साथ करना है।

1. सर्वर साइड अनुरोध करें

$("#btnCreateInvoice").click(function() {    
     $.ajax({ type: "POST", url: "YourHttpHandler.ashx", 
     contentType: "text/html; charset=utf-8", 
     dataType: "html", 
     success: function(data) { start the block UI } 
     }); 
    }); 

2. मतदान

आगे क्या आपको बस इतना करना 'टी' अंतराल पर सर्वर पोल और स्थिति पाने के लिए है। इसके लिए हमें 'टी' अंतराल पर एक फ़ंक्शन कॉल करने की आवश्यकता है जो स्थिति प्राप्त करने के लिए एक HTTPHandler को AJAX कॉल शुरू करेगा।

$(function() { 
    setInterval(updateStatus, 't'); 
}); 

function updateStatus() { 
    $.ajax({ type: "POST", url: "GetStatusHandler.ashx", 
     contentType: "text/html; charset=utf-8", 
     dataType: "html", 
     success: function(data) { process 'data' here and update the block UI message box } 
     }); 
} 

आपके मामले में, GetStatusHandler.ashx स्थिति के लिए पूर्ण आंतरिक HTML को वापस कर सकता है। पहले पर जैसे इसे कहते वापस आ जाएगी लिए 'पहले स्रोत लोड हो रहा है ...', तो यह वापस कर सकती है:
Loding पहले स्रोत ...
दूसरा स्रोत लोड हो रहा है ...
और इतने पर।

0

आप जो करने की कोशिश कर रहे हैं वह Comet जैसा कुछ है। पारंपरिक ("गैर-धूमकेतु") वेबसर्वर इस प्रकार के लेनदेन मॉडल के लिए डिज़ाइन नहीं किए गए हैं और इसलिए वांछित समाधान नहीं हैं।

मेरे सुझाव डेटा स्रोत प्रति एक ग्राहक के अनुरोध में प्रसंस्करण को तोड़ने के लिए है:

function loadData() { 
    // Each call passes callback(id) as a success handler 
    fireAsynchronousRequest("source1"); 
    fireAsynchronousRequest("source2"); 
    fireAsynchronousRequest("source3"); 
} 

function callback(var source) { 
    if (source == "source1") { 
     updateStatus("Source 1 loaded"); 
    } 
    else if (source == "source2") { 
     updateStatus("Source 2 loaded"); 
    } 
} 

यह एक अतुल्यकालिक समाधान का एक उदाहरण है। यदि आपको सिंक्रोनस होने की आवश्यकता है तो आप callback() में राज्य हैंडलिंग को कार्यान्वित कर सकते हैं।

0

खैर मेरे पास एक समान स्थिति थी और मैं इसे किसी अन्य दृष्टिकोण से हल करता हूं। यह एक बहुत ही उग्र काम है, मुझे पता है कि कृपया यह कहना शुरू न करें कि यह कितना बुरा है, क्योंकि मुझे पता है, लेकिन मुझे इसकी आवश्यकता के लिए ठीक था।

मैं सर्वर की ओर एक फ़ाइल में प्रगति डाल रहा हूं। उदाहरण के लिए, मेरे पास process.php है जिसे कॉल करने की ज़रूरत है और इसे पूरा होने में कुछ समय लगता है, इसलिए उपयोगकर्ता घबरा रहा है और वह ब्राउज़र बंद कर देता है (बहुत अच्छा नहीं)। तो process.php सर्वर पर किसी फ़ाइल को कुछ आउटपुट सहेज रहा है। जिस पृष्ठ पर process.php कहा जाता है, मेरे पास एक छोटा सा div, span, या जो भी मैं प्रगति प्रदर्शित करना चाहता हूं, लेकिन मैं div का सुझाव देता हूं। प्रत्येक एक्स मिलीसेकंड, या सेकेंड, मैं div में सर्वर से एक और स्क्रिप्ट लोड करता हूं, आइए display_info.php अब display_info.php फ़ाइल को पढ़ रहा है जिसे process.php द्वारा आउटपुट किया गया था और सामग्री div में diplayed है।

आपको सावधान रहना होगा कि प्रत्येक अवसर के लिए process.php से आउटपुट अद्वितीय होना चाहिए, अन्यथा आप ब्राउज़रों को जानकारी आउटपुट गड़बड़ कर देंगे।

एमिल