3

以下に示すように、XHRを使用して別のソースからコンテンツをフェッチしようとしています。

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();
}
}

接続タイムアウトが発生したとき、コンピューターにインターネット接続がないとき（たぶんぶらぶらしているときに切断が発生したとき）、またはWebページが他のソースのコンテンツをフェッチできないその他の状況で、ページにエラーを表示したい。

上記のコードを使用して、elseブロックif(xmlhttp.status==404 || xmlhttp.responseText == "")内で/* */コメントセクションに移動すると、404エラーでない限りエラーは発生しません。コメントセクションに移動//すると、フェッチプロセスが開始されてから完了するまで、つまりからまでの間にエラーが表示されxmlhttp.readyState = 0ますxmlhttp.readyState = 4。これらの属性などを使用して接続エラーメッセージを表示するにはどうすればよいですか？

ご清聴ありがとうございました:)

4

2 に答える 2

9

このstackoverflowによると：XMLHttpRequest（Ajax）エラー

 xmlhttp.onreadystatechange = function (oEvent) {
   if (xmlhttp.readyState === 4) {
     if (xmlhttp.status === 200) {
       console.log(xmlhttp.responseText)
     } else {
       console.log("Error", xmlhttp.statusText)
     }
   }
 }
于 2013-02-05T20:01:37.007 に答える
3

問題は、前の質問の私のテンプレートに欠陥があったことです。これは、操作する必要のある変数を渡すためのクロージャーを作成するため、より適切に機能すると思います。

繰り返しになりますが、私はこれをテストしなかったので、タイプミスやバグがある可能性がありpostCallback()ます。また、呼び出されてパラメーターを追加する方法以外は何も変更しませんでした。

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();
}
}
于 2013-02-05T22:06:57.200 に答える