jQuery Academy · पाठ

AJAX त्रुटियों और सफलता को संभालना

लचीले अनुप्रयोगों के लिए .fail() और .always() कॉलबैक से सुदृढ़ त्रुटि-प्रबंधन तंत्र लागू करें और .done() से सफल डेटा प्राप्ति को संसाधित करें।

पाठ 2, कुल 3 में से11 चरण

AJAX त्रुटियों और सफलता को संभालना, CoddyKit पर jQuery Academy का एक निःशुल्क पाठ है। यह 3 में से 2वाँ पाठ है। इस अध्ययन पथ के 3 तक कोई भी पाठ पूरा पढ़ना निःशुल्क है — इसके बाद CoddyKit PRO हर पाठ अनलॉक करता है, साथ ही अंतर्निर्मित कोड संपादक और चौबीसों घंटे एआई शिक्षक के साथ व्यावहारिक अभ्यास भी उपलब्ध कराता है। यह jQuery Academy सीखने के मार्ग का हिस्सा है और आपकी प्रगति वेब तथा CoddyKit ऐप पर सिंक होती रहती है। jQuery Academy पाठ्यक्रम में कुल 3 पाठ शामिल हैं।

अतुल्यकालिक परिणामों को संभालना

जब आप AJAX अनुरोध करते हैं, तो वह एक अतुल्यकालिक प्रक्रिया होती है। इसका अर्थ है कि आपका कोड सर्वर की प्रतिक्रिया की प्रतीक्षा नहीं करता; वह अन्य कार्यों को निष्पादित करता रहता है।

सर्वर के उत्तर (या उसके न मिलने) को संभालने के लिए jQuery कॉलबैक नामक विशेष विधियाँ उपलब्ध कराता है। ये फ़ंक्शन केवल तब चलते हैं जब कुछ विशेष घटनाएँ घटित होती हैं, जैसे सफलता या विफलता।

जब सब कुछ सही हो

.done() कॉलबैक सफल AJAX अनुरोधों को संभालने के लिए आपका मुख्य साधन है। यह तब निष्पादित होता है जब सर्वर सफलता दर्शाने वाला स्थिति कोड भेजता है (आमतौर पर 200-299)।

इसे सर्वर से लौटाया गया डेटा प्राप्त होता है।
नई जानकारी से अपने UI को अपडेट करने के लिए यह सबसे उपयुक्त स्थान है।

सफल डेटा दिखाना

आइए कुछ डेटा प्राप्त करें और अनुरोध सफल होने पर उसे दिखाएँ। ध्यान दें कि .done() को $.ajax() कॉल के साथ कैसे जोड़ा गया है।

$(document).ready(function() {
  $.ajax({
    url: "https://jsonplaceholder.typicode.com/posts/1",
    method: "GET"
  })
  .done(function(data) {
    console.log("Success! Data received:");
    console.log(data.title); // Access a property
    $('body').append('<p>Post Title: ' + data.title + '</p>');
  });
});

जब चीज़ें गलत हो जाएँ

लेकिन यदि सर्वर आपका अनुरोध पूरा न कर पाए तो क्या होगा? ऐसे में .fail() कॉलबैक काम आता है। यह तब चलता है जब AJAX अनुरोध में कोई त्रुटि आती है, जैसे 404 (नहीं मिला) या 500 (सर्वर त्रुटि)।

यह उपयोगकर्ता को सूचित करने या समस्याओं का लॉग दर्ज करने में आपकी सहायता करता है।
इसे त्रुटि का विवरण प्राप्त होता है।

विफलताओं पर प्रतिक्रिया देना

आइए किसी ऐसे URL से डेटा प्राप्त करने का प्रयास करें जो मौजूद नहीं है। .fail() कॉलबैक त्रुटि को पकड़ेगा और उसका विवरण लॉग करेगा।

$(document).ready(function() {
  $.ajax({
    url: "https://jsonplaceholder.typicode.com/nonexistent", // This URL will fail
    method: "GET"
  })
  .done(function(data) {
    console.log("This won't run on error.");
  })
  .fail(function(jqXHR, textStatus, errorThrown) {
    console.log("Error! Status: " + textStatus);
    console.log("HTTP Error: " + errorThrown);
    $('body').append('<p>Error fetching data!</p>');
    $('body').append('<p>Status: ' + textStatus + '</p>');
  });
});

त्रुटि पैरामीटर को समझना

.fail() कॉलबैक तीन उपयोगी पैरामीटर उपलब्ध कराता है, जो यह समझने में आपकी सहायता करते हैं कि क्या गलत हुआ:

jqXHR: jQuery XMLHttpRequest ऑब्जेक्ट, जो निम्न-स्तरीय विवरण उपलब्ध कराता है।
textStatus: त्रुटि के प्रकार का वर्णन करने वाली स्ट्रिंग (जैसे, "timeout", "error", "abort")।
errorThrown: HTTP स्थिति का पाठ (जैसे, 404 के लिए "Not Found")।

उपयोगकर्ताओं को विशिष्ट प्रतिक्रिया देने के लिए इनका उपयोग करें।

हर स्थिति में हमेशा चलना

कभी-कभी आपको ऐसा कार्य करना होता है, चाहे AJAX अनुरोध सफल हो या विफल। यही कार्य .always() कॉलबैक करता है।

यह या तो .done() या .fail() के बाद हमेशा निष्पादित होता है।
यह लोडिंग स्पिनर छिपाने या बटन को फिर से सक्षम करने जैसे सफ़ाई कार्यों के लिए उपयोगी है।

सफ़ाई कार्य करना

आइए अपने पिछले उदाहरण में .always() जोड़ें। हम लोडिंग स्थिति का अनुकरण करेंगे और सुनिश्चित करेंगे कि अनुरोध सफल हो या विफल, वह स्थिति हटा दी जाए।

$(document).ready(function() {
  $('body').append('<p id="status">Loading data...</p>'); // Simulate loading
  $.ajax({
    url: "https://jsonplaceholder.typicode.com/posts/1", // Try changing to 'nonexistent' to see fail+always
    method: "GET"
  })
  .done(function(data) {
    console.log("Success! Data: " + data.title);
    $('#status').text('Data loaded successfully!');
  })
  .fail(function(jqXHR, textStatus, errorThrown) {
    console.log("Failed! " + textStatus);
    $('#status').text('Failed to load data!');
  })
  .always(function() {
    console.log("Request finished (success or failure).");
    // This could be where you hide a spinner or re-enable a button
    $('#status').append(' (Finished)');
  });
});

अपने कॉलबैक व्यवस्थित करना

jQuery की AJAX विधियाँ Promise-जैसी ऑब्जेक्ट लौटाती हैं, जिससे आप सीधे .done(), .fail() और .always() विधियों को श्रृंखलाबद्ध कर सकते हैं।

यह श्रृंखलाबद्धता आपके कोड को अधिक साफ़ और पढ़ने में आसान बनाती है तथा सफलता, त्रुटि और अंतिम तर्क के ब्लॉकों को स्पष्ट रूप से अलग करती है।

अपनी जानकारी जाँचें

निम्नलिखित jQuery AJAX अनुरोध पर विचार करें:


$.ajax({
  url: "/api/data",
  method: "GET"
})
.done(function() {
  console.log("A");
})
.fail(function() {
  console.log("B");
})
.always(function() {
  console.log("C");
});

यदि सर्वर 404 Not Found त्रुटि के साथ प्रतिक्रिया देता है, तो कंसोल में क्या प्रिंट होगा?

इंटरैक्टिव पाठ में इसका उत्तर दें

AJAX हैंडलिंग का सारांश

आपने मजबूत AJAX हैंडलिंग के लिए आवश्यक कॉलबैक सीख लिए हैं:

.done(): सफल प्रतिक्रियाओं के लिए।
.fail(): त्रुटियों को संभालने के लिए।
.always(): उन कार्यों के लिए जिन्हें हर स्थिति में चलना चाहिए।

इनका उपयोग करके आपके एप्लिकेशन नेटवर्क से होने वाली अंतःक्रियाओं को सहजता से संभाल सकते हैं और अनपेक्षित परिस्थितियों में भी उपयोगकर्ताओं को बेहतर अनुभव दे सकते हैं!

शुरुआत निःशुल्क

एआई शिक्षक के साथ JavaScript सीखें — निःशुल्क

अपने ब्राउज़र में वास्तविक कोड लिखें और चलाएँ, चौबीसों घंटे एआई शिक्षक से तुरंत सहायता पाएँ, और वेब या ऐप पर वहीं से शुरू करें जहाँ आपने छोड़ा था।

पाठ्यक्रम: 22
पाठ: 48

निःशुल्क सीखना शुरू करें पूरा पाठ्यक्रम देखें

अक्सर पूछे जाने वाले प्रश्न

क्या “AJAX त्रुटियों और सफलता को संभालना” पाठ निःशुल्क है?

हाँ — jQuery Academy अध्ययन पथ के 3 तक कोई भी पाठ, जिसमें “AJAX त्रुटियों और सफलता को संभालना” भी शामिल है, यहाँ वेब पर पूरा पढ़ना निःशुल्क है। इसके बाद CoddyKit PRO हर पाठ अनलॉक करता है, साथ ही अंतर्निर्मित कोड संपादक और चौबीसों घंटे एआई शिक्षक के साथ इंटरैक्टिव अभ्यास भी उपलब्ध कराता है। jQuery Academy पाठ्यक्रम में कुल 3 पाठ शामिल हैं।

“AJAX त्रुटियों और सफलता को संभालना” में मैं क्या सीखूँगा?

लचीले अनुप्रयोगों के लिए .fail() और .always() कॉलबैक से सुदृढ़ त्रुटि-प्रबंधन तंत्र लागू करें और .done() से सफल डेटा प्राप्ति को संसाधित करें। आप ब्राउज़र में सीधे चलाए जाने वाले व्यावहारिक कोड के साथ jQuery Academy का अभ्यास करते हैं, और पाठ पूरा करते समय 24/7 एआई ट्यूटर आपके प्रश्नों के उत्तर देता है।

क्या jQuery Academy शुरू करने के लिए मुझे किसी अनुभव की आवश्यकता है?

पहले के अनुभव की आवश्यकता नहीं है। CoddyKit पर jQuery Academy शुरुआती से लेकर उन्नत शिक्षार्थियों तक सभी के लिए व्यवस्थित किया गया है, इसलिए आप यहीं से या शुरुआत से सीखना शुरू कर सकते हैं और अपनी गति से आगे बढ़ सकते हैं। यह 3 में से 2वाँ पाठ है।

“AJAX त्रुटियों और सफलता को संभालना” पाठ पूरा करने में कितना समय लगता है?

CoddyKit का अधिकांश पाठ लगभग 5–10 मिनट में पूरा हो जाता है। हर पाठ छोटा और संवादात्मक है, इसलिए आप लगातार प्रगति करते हैं और वेब या ऐप पर वहीं से सीखना जारी रख सकते हैं जहाँ आपने छोड़ा था।

क्या मैं इस jQuery Academy पाठ में कोड लिख और चला सकता हूँ?

हाँ। हर jQuery Academy पाठ में एक अंतर्निर्मित कोड संपादक शामिल है, जिससे आप सीधे अपने ब्राउज़र में वास्तविक कोड लिख और चला सकते हैं और तुरंत एआई प्रतिक्रिया पा सकते हैं—स्थानीय सेटअप की आवश्यकता नहीं है।

इस पाठ्यक्रम के सभी पाठ

AJAX अनुरोधों को प्रभावी ढंग से कॉन्फ़िगर करना
AJAX त्रुटियों और सफलता को संभालना
क्रॉस-डोमेन AJAX (CORS/JSONP)

← jQuery Academy पर वापस जाएँ