JQuery Ajax - कैसे Ajax कॉल करते समय नेटवर्क कनेक्शन त्रुटि का पता लगाने के लिए


91

मेरे पास कुछ जावास्क्रिप्ट JQuery कोड है जो हर 5 मिनट में सर्वर पर एक अजाक्स कॉल करता है, यह सर्वर सत्र को जीवित रखने और उपयोगकर्ता को लॉग इन रखने के लिए है। मैं $.ajax()JQuery में विधि का उपयोग कर रहा हूं । इस फ़ंक्शन के पास एक 'त्रुटि' गुण है जिसे मैं उस घटना में उपयोग करने की कोशिश कर रहा हूं जो उपयोगकर्ता का इंटरनेट कनेक्शन नीचे चला जाता है ताकि KeepAlive स्क्रिप्ट चलती रहे। मैं निम्नलिखित कोड का उपयोग कर रहा हूं:

var keepAliveTimeout = 1000 * 10;

function keepSessionAlive()
{
    $.ajax(
    {
        type: 'GET',
        url: 'http://www.mywebapp.com/keepAlive',
        success: function(data)
        {
            alert('Success');

            setTimeout(function()
            {
                keepSessionAlive();
            }, keepAliveTimeout);
        },
        error: function(XMLHttpRequest, textStatus, errorThrown)
        {
            alert('Failure');

            setTimeout(function()
            {
                keepSessionAlive();
            }, keepAliveTimeout);
        }
    });
}

जब मैं इसे चलाता हूं, तो मुझे हर 10 सेकंड में एक अलर्ट बॉक्स में स्क्रीन पर 'सक्सेस' पॉपअप मिलेगा जो ठीक है। हालांकि, जैसे ही मैं नेटवर्क केबल को अनप्लग करता हूं, मुझे कुछ भी नहीं मिलता है, मैं त्रुटि फ़ंक्शन को कॉल करने और 'विफलता' अलर्ट बॉक्स देखने की उम्मीद कर रहा था, लेकिन कुछ भी नहीं होता है।

क्या मैं यह मानने में सही हूँ कि 'त्रुटि' फ़ंक्शन केवल गैर '200' स्थिति कोड के लिए है जो सर्वर से लौटा है? क्या अजाक्स कॉल करते समय नेटवर्क कनेक्शन समस्याओं का पता लगाने का एक तरीका है?


क्या आपने ग्राहक के नेटवर्क केबल या सर्वर के नेटवर्क केबल को अनप्लग कर दिया है?
जेफ सनातन

क्या आप अपने कनेक्शन को अनप्लग करने के बाद 'सफलता' को प्राप्त करना जारी रखते हैं?
विल्किंस

3
@ जेफ़ - यह क्लाइंट-एंड में इंटरनेट कनेक्शन का नुकसान है जो समस्या का कारण बन रहा है। अविश्वसनीय रूप से यह वास्तव में हो रहा है क्योंकि कुछ ग्राहक डोडी वायरलेस कनेक्शन के साथ ऐप का उपयोग करते हैं जो बाहर गिरता रहता है। एक कहावत है "कभी भी अपने एप्लिकेशन को तोड़ने के तरीके खोजने के लिए अंतिम उपयोगकर्ताओं की क्षमता को कम मत समझो", निश्चित रूप से यहां सच में बजता है :-)
रविवार को आयरनफुट

@qwertypants - नहीं, इंटरनेट कनेक्शन खो जाने के बाद कुछ भी नहीं होता है (उदाहरण केबल को अनप्लग करना)। हालांकि $ .ajax का प्रयास किया जाता है, मैं इसे फायरबग में देख सकता हूं।
रविवार आयरनफुट

क्या कनेक्शन के प्रयास के लिए समय निर्धारित करने का कोई तरीका है?
18

जवाबों:


98
// start snippet
error: function(XMLHttpRequest, textStatus, errorThrown) {
        if (XMLHttpRequest.readyState == 4) {
            // HTTP error (can be checked by XMLHttpRequest.status and XMLHttpRequest.statusText)
        }
        else if (XMLHttpRequest.readyState == 0) {
            // Network error (i.e. connection refused, access denied due to CORS, etc.)
        }
        else {
            // something weird is happening
        }
    }
//end snippet

4
यह स्वीकृत उत्तर होना चाहिए। त्रुटि फ़ंक्शन में आप $ .ajax को प्रदान करते हैं, पहला पैरामीटर सभी प्रकार की स्थिति की जानकारी प्रदान करता है। ऐसा तब भी होता है जब आप टाइमआउट सेट नहीं करते हैं।
माइक स्पीयर

और एजाक्स फॉर्म के साथ भी ऐसा ही करें: <form ... data-ajax-failure="YourMethod" ...></form>और अपने तरीके परfunction YourMethod(XMLHttpRequest) { ..same code... }
Matthieu Charbonnier

1
अधिक के लिए XMLHttpRequest.readyStateदेखें ajax_xmlhttprequest_response.asp
stomy

13

आपको बस जोड़ना चाहिए: timeout: <number of miliseconds>,कहीं भीतर $.ajax({})। इसके अलावा, cache: false,कुछ परिदृश्यों में मदद मिल सकती है।

$ .ajax अच्छी तरह से प्रलेखित है , आपको वहाँ विकल्पों की जाँच करनी चाहिए, कुछ उपयोगी मिल सकता है।

सौभाग्य!


1
अजाक्स में सभी दस्तावेज नहीं हैं और किसी भी तरह से छिपा हुआ है :(
एस्पांता

9

चूंकि मैं इस मुद्दे की नकल नहीं कर सकता, मैं केवल अजाक्स कॉल पर टाइमआउट के साथ प्रयास करने का सुझाव दे सकता हूं। JQuery में आप इसे $ .ajaxSetup के साथ सेट कर सकते हैं (और यह आपके सभी $ .ajax कॉल के लिए वैश्विक होगा) या आप इसे विशेष रूप से अपनी कॉल के लिए इस तरह सेट कर सकते हैं:

$.ajax({
    type: 'GET',
    url: 'http://www.mywebapp.com/keepAlive',
    timeout: 15000,
    success: function(data) {},
    error: function(XMLHttpRequest, textStatus, errorThrown) {}
})

JQuery आपके कॉल पर 15 सेकंड का समय पंजीकृत करेगा; उसके बाद सर्वर jQuery से http प्रतिक्रिया कोड के बिना "टाइमआउट" के लिए सेट टेक्स्टस्टैटस मान के साथ त्रुटि कॉलबैक को निष्पादित करेगा। इसके साथ आप कम से कम अजाक्स कॉल को रोक सकते हैं लेकिन आप कनेक्शन के नुकसान से वास्तविक नेटवर्क के मुद्दों को अलग करने में सक्षम नहीं होंगे।


3

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

function handleError(jqXHR, textStatus, errorThrown) {
    ...
}

jQuery.ajax({
    ...
    success: function(data, textStatus, jqXHR) {
        if (data == "") handleError(jqXHR, "clientNetworkError", "");
    },
    error: handleError
});


0

उपयोग

xhr.onerror = function(e){
    if (XMLHttpRequest.readyState == 4) {
        // HTTP error (can be checked by XMLHttpRequest.status and XMLHttpRequest.statusText)
        selFoto.erroUploadFoto('Erro HTTP: '+XMLHttpRequest.statusText);
    }
    else if (XMLHttpRequest.readyState == 0) {
        // Network error (i.e. connection refused, access denied due to CORS, etc.)
        selFoto.erroUploadFoto('Erro de rede:'+XMLHttpRequest.statusText);
    }
    else {
        selFoto.erroUploadFoto('Erro desconhecido.');
    }

};

(नीचे और अधिक कोड - UPLOAD IMAGE EXAMPLE)

var selFoto = {
   foto: null,

   upload: function(){
        LoadMod.show();

        var arquivo = document.frmServico.fileupload.files[0];
        var formData = new FormData();

        if (arquivo.type.match('image.*')) {
            formData.append('upload', arquivo, arquivo.name);

            var xhr = new XMLHttpRequest();
            xhr.open('POST', 'FotoViewServlet?acao=uploadFoto', true);
            xhr.responseType = 'blob';

            xhr.onload = function(e){
                if (this.status == 200) {
                    selFoto.foto = this.response;
                    var url = window.URL || window.webkitURL;
                    document.frmServico.fotoid.src = url.createObjectURL(this.response);
                    $('#foto-id').show();
                    $('#div_upload_foto').hide();           
                    $('#div_master_upload_foto').css('background-color','transparent');
                    $('#div_master_upload_foto').css('border','0');

                    Dados.foto = document.frmServico.fotoid;
                    LoadMod.hide();
                }
                else{
                    erroUploadFoto(XMLHttpRequest.statusText);
                }

                if (XMLHttpRequest.readyState == 4) {
                     selFoto.erroUploadFoto('Erro HTTP: '+XMLHttpRequest.statusText);
                }
                else if (XMLHttpRequest.readyState == 0) {
                     selFoto.erroUploadFoto('Erro de rede:'+XMLHttpRequest.statusText);                             
                }

            };

            xhr.onerror = function(e){
            if (XMLHttpRequest.readyState == 4) {
                // HTTP error (can be checked by XMLHttpRequest.status and XMLHttpRequest.statusText)
                selFoto.erroUploadFoto('Erro HTTP: '+XMLHttpRequest.statusText);
            }
            else if (XMLHttpRequest.readyState == 0) {
                 // Network error (i.e. connection refused, access denied due to CORS, etc.)
                 selFoto.erroUploadFoto('Erro de rede:'+XMLHttpRequest.statusText);
            }
            else {
                selFoto.erroUploadFoto('Erro desconhecido.');
            }
        };

        xhr.send(formData);
     }
     else{
        selFoto.erroUploadFoto('');                         
        MyCity.mensagens.push('Selecione uma imagem.');
        MyCity.showMensagensAlerta();
     }
  }, 

  erroUploadFoto : function(mensagem) {
        selFoto.foto = null;
        $('#file-upload').val('');
        LoadMod.hide();
        MyCity.mensagens.push('Erro ao atualizar a foto. '+mensagem);
        MyCity.showMensagensAlerta();
 }
 };

-1

यदि उनके नेटवर्क के ख़राब होने या पेज अपडेट में विफलता के मामले में मैंने उपयोगकर्ता को सचेत करने के लिए क्या किया है:

  1. मेरे पास उस पृष्ठ पर एक दिव्य-टैग है जहां मैं वर्तमान समय डालता हूं और हर 10 सेकंड में इस टैग को अपडेट करता हूं। यह कुछ इस तरह दिखता है:<div id="reloadthis">22:09:10</div>

  2. जावास्क्रिप्ट-फंक्शन के अंत में जो डिव-टैग में समय को अपडेट करता है, मैंने इसे डाल दिया (समय के बाद इसे अपडेट किया गया है):

    var new_value = document.getElementById('reloadthis').innerHTML;
    var new_length = new_value.length;
    if(new_length<1){
        alert("NETWORK ERROR!");
    }
    

बस! आप अलर्ट-पार्ट को अपनी पसंद की किसी भी चीज़ से बदल सकते हैं। उम्मीद है की यह मदद करेगा।


-6

क्या आपने यह कोशिश की है?

$(document).ajaxError(function(){ alert('error'); }

कि सभी AjaxErrors को संभालना चाहिए। मैं इसे यहाँ पाया । वहां आपको इन त्रुटियों को अपने फ़ायरबग कंसोल पर लिखने की संभावना भी मिलती है।

हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.