[JQUERY] jQuery Ajax - Ajax 호출을 할 때 네트워크 연결 오류를 감지하는 방법

jQuery Ajax - Ajax 호출을 할 때 네트워크 연결 오류를 감지하는 방법

해결법

1. ---

   1.

   // 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
   

2. ---

   2.다음을 추가해야합니다. 시간 초과 : <밀리 초 (밀리 초), $ .ajax ({}) 내 어딘가에 있습니다. 또한 캐시 : FALSE는 몇 가지 시나리오에서 도움이 될 수 있습니다.

   다음을 추가해야합니다. 시간 초과 : <밀리 초 (밀리 초), $ .ajax ({}) 내 어딘가에 있습니다. 또한 캐시 : FALSE는 몇 가지 시나리오에서 도움이 될 수 있습니다.

   $ .AJAX가 잘 문서화되어있어 옵션을 확인해야합니다. 유용한 것을 찾을 수 있습니다.

   행운을 빕니다!

3. ---

   3.문제를 복제 할 수 없으므로 AJAX 호출에서 시간 초과를 사용해보십시오. jQuery에서 $ .ajaxsetup (그리고 모든 $ .ajax 호출에 대해 전역이 될 것입니다)로 설정하거나 다음과 같이 호출을 위해 특별히 설정할 수 있습니다.

   문제를 복제 할 수 없으므로 AJAX 호출에서 시간 초과를 사용해보십시오. 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 응답 코드가없는 후 TextStatus 값이 "Timeout"로 설정된 오류 콜백을 실행합니다. 이를 통해 AJAX 호출을 적어도 중지 할 수 있지만 연결 손실로 인해 실제 네트워크 문제를 구별 할 수 없습니다.

4. ---

   4.이 경우에 내가 보는 것은 클라이언트 머신의 네트워크 케이블을 가져 와서 통화를 만들면 Ajax 성공 처리기가 호출되면 (왜 내가 모르겠지만, 데이터 매개 변수가 빈 문자열이됩니다. 따라서 실제 오류 처리가 나오는 경우 다음과 같이 할 수 있습니다.

   이 경우에 내가 보는 것은 클라이언트 머신의 네트워크 케이블을 가져 와서 통화를 만들면 Ajax 성공 처리기가 호출되면 (왜 내가 모르겠지만, 데이터 매개 변수가 빈 문자열이됩니다. 따라서 실제 오류 처리가 나오는 경우 다음과 같이 할 수 있습니다.

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

5. ---

   5.교차 도메인을 사용하는 경우 JSONP를 사용하십시오. 그렇지 않으면 오류가 반환되지 않습니다.

   교차 도메인을 사용하는 경우 JSONP를 사용하십시오. 그렇지 않으면 오류가 반환되지 않습니다.

6. ---

   6.사용하다

   사용하다

   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.');
       }
   
   };
   

   (아래의 코드 더 많은 코드 - 이미지 예제 업로드)

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

7. ---

   7.네트워크가 다운되었거나 페이지 업데이트 실패시 사용자를 경고하는 것이 사용자에게 알려 왔던 것입니다.

   네트워크가 다운되었거나 페이지 업데이트 실패시 사용자를 경고하는 것이 사용자에게 알려 왔던 것입니다.

   그게 다야! 물론 경고 부분을 원하는 모든 것으로 바꿀 수 있습니다. 도움이 되었기를 바랍니다.

8. ---

   8.이걸 시도 했니?

   이걸 시도 했니?

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

   모든 AjaxErrors를 처리해야합니다. 나는 그것을 여기에서 발견했다. 이러한 오류를 Firebug 콘솔에 쓸 수있는 가능성을 찾을 수 있습니다.

from https://stackoverflow.com/questions/1730692/jquery-ajax-how-to-detect-network-connection-error-when-making-ajax-call by cc-by-sa and MIT license