Come gestire XHR errore di visualizzazione dei messaggi?

Sto cercando di recuperare un po ‘ di contenuto da un’altra fonte, utilizzando XHR, come illustrato di seguito:

function fetchPage(str)
{
    if(str=="")
    {
        document.getElementById("table").innerHTML="";
        resetFilters();
        $('#progress').hide();  //fetching progress bar <div>
        return;
    }
    if (window.XMLHttpRequest) //code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp=new XMLHttpRequest();
    else //code for IE6, IE5
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");

    xmlhttp.onreadystatechange=postCallback;
    xmlhttp.open("GET", "fetch.php?url=http://www.sis.itu.edu.tr/tr/ders_programlari/LSprogramlar/prg.php?fb="+str, true);
    xmlhttp.send();

//any stuff that goes here will happen before callback
// (this is a good place to update a UI element showing a call is resolving.)
// (for example a spinner or text saying "fetching")
$('#progress').show();
progressFetching();
switch(xmlhttp.readyState){ //loading bar adjustments
    case 0:
        $('.bar').css("width","0%");
        $('.bar').text("0%");
        break;
    case 1:
        $('.bar').css("width","25%");
        $('.bar').text("25%");
        break;
    case 2:
        $('.bar').css("width","50%");
        $('.bar').text("50%");
        break;
    case 3:
        $('.bar').css("width","75%");
        $('.bar').text("75%");
        break;
}
}



function postCallback()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200){
    progressDone();   //loading is finished
    $('#error').hide();
    document.getElementById("table").innerHTML=xmlhttp.responseText;                     

    //continue to process post callback.
    resetFilters();
}
else {
    //report error with fetch

    /*if(xmlhttp.status==404 || xmlhttp.responseText == "")
        $('#error').show();*/
    //$('#error').show();
}
}

Voglio che la mia pagina di errore visualizzato quando il timeout di connessione si verifica, o quando il computer non dispone di una connessione internet (forse una disconnessione si è verificato mentre era in giro) o di qualsiasi altra situazione in cui la pagina web non riesce a recuperare il contenuto dell’altra fonte.

Utilizzando il codice di cui sopra, nel else blocco, se vado per if(xmlhttp.status==404 || xmlhttp.responseText == "") in /* */ sezione di commento, ho vinto ‘ t ottenere un errore a meno che il suo non è un errore 404. Se vado per // sezione di commento, di errore verrà visualizzato dopo il processo di recupero è iniziato fino a quando non è completato, ossia tra xmlhttp.readyState = 0 attraverso xmlhttp.readyState = 4. Come faccio a visualizzare messaggi di errore di connessione utilizzando questi attributi o qualcos’altro?

Vi ringraziamo per la vostra attenzione:)

Dal momento che hai già jQuery nel luogo, perché non utilizzare jQuery per XHR gestione? È il modo più facile e, probabilmente, corregge alcuni cross browser di problemi che hai non penso (ancora).
Penso che si sta usando jQuery, se è il caso di check-out: api.jquery.com/jQuery.ajax e guardate un po ‘ “errore” parametro non riprogrammare quello che hai già)
Io sono nuovo a questo, grazie per i vostri suggerimenti:)

OriginaleL’autore Varaquilex | 2013-02-05

2 Replies
  1. 3

    Il problema è il mio modello nella domanda precedente era errata. Credo che questo funzionerà meglio, perché crea una chiusura a passare la variabile è necessario lavorare con.

    Ancora una volta, non ho fatto il test in questo modo si potrebbe avere errori di battitura e di bug — e non mi cambia nulla, tranne come postCallback() viene richiamato e ha aggiunto un parametro.

    function fetchPage(str)
    {
        if(str=="")
        {
            document.getElementById("table").innerHTML="";
            resetFilters();
            $('#progress').hide();  //fetching progress bar <div>
            return;
        }
        var xmlhttp;
    
        if (window.XMLHttpRequest) //code for IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp=new XMLHttpRequest();
        else //code for IE6, IE5
            xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    
        xmlhttp.onreadystatechange=function () { postCallback(xmlhttp); };
        xmlhttp.open("GET", "fetch.php?url=http://www.sis.itu.edu.tr/tr/ders_programlari/LSprogramlar/prg.php?fb="+str, true);
        xmlhttp.send();
    
    //any stuff that goes here will happen before callback
    // (this is a good place to update a UI element showing a call is resolving.)
    // (for example a spinner or text saying "fetching")
    $('#progress').show();
    progressFetching();
    switch(xmlhttp.readyState){ //loading bar adjustments
        case 0:
            $('.bar').css("width","0%");
            $('.bar').text("0%");
            break;
        case 1:
            $('.bar').css("width","25%");
            $('.bar').text("25%");
            break;
        case 2:
            $('.bar').css("width","50%");
            $('.bar').text("50%");
            break;
        case 3:
            $('.bar').css("width","75%");
            $('.bar').text("75%");
            break;
    }
    }
    
    
    
    function postCallback(xmlhttp)
    {
    if (xmlhttp.readyState==4 && xmlhttp.status==200){
        progressDone();   //loading is finished
        $('#error').hide();
        document.getElementById("table").innerHTML=xmlhttp.responseText;                     
    
        //continue to process post callback.
        resetFilters();
    }
    else {
        //report error with fetch
    
        /*if(xmlhttp.status==404 || xmlhttp.responseText == "")
            $('#error').show();*/
        //$('#error').show();
    }
    }
    Grazie @Hogan, ho lavorato fuori modificando un po’. Ho visto il problema e modificata la funzione, come lei ha suggerito. Qui è il codice risultante if (xmlhttp.readyState==4){ if(xmlhttp.status==200 && xmlhttp.responseText != ""){ e else { $('#progress').hide(); $('#error').show(); } Tutto sembra funzionare come avrei desiderato. E ‘ una buona programmazione? Grazie:)

    OriginaleL’autore Hogan

  2. 9

    Secondo questa stackoverflow: XMLHttpRequest (Ajax) Errore

     xmlhttp.onreadystatechange = function (oEvent) {
       if (xmlhttp.readyState === 4) {
         if (xmlhttp.status === 200) {
           console.log(xmlhttp.responseText)
         } else {
           console.log("Error", xmlhttp.statusText)
         }
       }
     }
    Questo non aiuta, perché in questo esempio è in linea e il suo esempio è esterno, che è dove è il problema.

    OriginaleL’autore Kolby

Lascia un commento