ajax의 시간 초과 설정(jQuery)

ajax의 시간 초과 설정(jQuery)

$.ajax({
    url: "test.html",
    error: function(){
        //do something
    },
    success: function(){
        //do something
    }
});

가끔씩success기능은 정상적으로 동작하지만, 경우에 따라서는 동작하지 않을 수 있습니다.

이 Ajax 요청에 대한 시간 초과를 설정하려면 어떻게 해야 합니까?예를 들어, 3초 동안 시간이 초과되면 오류가 표시됩니다.

문제는 Ajax 요구가 완료될 때까지 블록을 동결한다는 것입니다.서버가 잠시 동안 다운되면 종료되지 않습니다.

읽어주세요$.ajax 매뉴얼에 기재되어 있습니다.

$.ajax({
    url: "test.html",
    error: function(){
        // will fire when timeout is reached
    },
    success: function(){
        //do something
    },
    timeout: 3000 // sets timeout to 3 seconds
});

의 textStatus 파라미터에 접속하여 어떤 유형의 오류가 발생했는지 확인할 수 있습니다.error: function(jqXHR, textStatus, errorThrown)선택.옵션은 "timeout", "error", "abort" 및 "parserror"입니다.

다음은 jQuery의 이전 패러다임과 새로운 패러다임에서의 타임아웃 설정 및 검출을 보여주는 예입니다.

Live Demo

jQuery 1.8+로 약속

Promise.resolve(
  $.ajax({
    url: '/getData',
    timeout:3000 //3 second timeout
  })
).then(function(){
  //do something
}).catch(function(e) {
  if(e.statusText == 'timeout')
  {     
    alert('Native Promise: Failed from timeout'); 
    //do something. Try again perhaps?
  }
});

jQuery 1.8 이상

$.ajax({
    url: '/getData',
    timeout:3000 //3 second timeout
}).done(function(){
    //do something
}).fail(function(jqXHR, textStatus){
    if(textStatus === 'timeout')
    {     
        alert('Failed from timeout'); 
        //do something. Try again perhaps?
    }
});​

jQuery <= 1.7.2

$.ajax({
    url: '/getData',
    error: function(jqXHR, textStatus){
        if(textStatus === 'timeout')
        {     
             alert('Failed from timeout');         
            //do something. Try again perhaps?
        }
    },
    success: function(){
        //do something
    },
    timeout:3000 //3 second timeout
});

textStatus param(또는 jqXHR.statusText)을 통해 오류가 무엇인지 알 수 있습니다.이는 장애가 타임아웃으로 인해 발생했음을 알고 싶을 때 유용합니다.

error(jqXHR, textStatus, 오류)던지다)

요청이 실패했을 때 호출되는 함수입니다.함수는 다음 3개의 인수를 수신합니다.jqXHR(jQuery 1.4.x, XMLHttpRequest의 경우) 객체. 발생한 오류의 유형을 설명하는 문자열 및 발생한 경우 옵션 예외 객체입니다.두 번째 인수(null 제외)에 사용할 수 있는 값은 "timeout", "error", "abort" 및 "parserror"입니다.HTTP 에러가 발생하면, 에러가 발생합니다.느려짐은 "Not Found" 또는 "Internal Server Error"와 같은 HTTP 상태의 텍스트 부분을 수신합니다.jQuery 1.5에서는 오류 설정으로 함수 배열을 허용할 수 있습니다.각 함수가 차례로 호출됩니다.주의: 이 핸들러는 크로스 도메인스크립트 및 JSONP 요구에 대해서는 호출되지 않습니다.

src: http://api.jquery.com/jQuery.ajax/

를 사용할 수 있습니다.timeoutAjax 옵션에서 다음과 같이 설정합니다.

$.ajax({
    url: "test.html",
    timeout: 3000,
    error: function(){
        //do something
    },
    success: function(){
        //do something
    }
});

ajax 옵션에 대한 자세한 내용은 http://api.jquery.com/jQuery.ajax/를 참조하십시오.

타임아웃이 발생하면,error핸들러는 트리거되지만success핸들러:)

풀사이즈를 사용하다..ajaxjQuery 함수예를 들어 https://stackoverflow.com/a/3543713/1689451과 비교합니다.

테스트 없이 코드를 참조 SO 질문과 병합하기만 하면 됩니다.

target = $(this).attr('data-target');

$.ajax({
    url: $(this).attr('href'),
    type: "GET",
    timeout: 2000,
    success: function(response) { $(target).modal({
        show: true
    }); },
    error: function(x, t, m) {
        if(t==="timeout") {
            alert("got timeout");
        } else {
            alert(t);
        }
    }
});​

당신의 요청은 다음과 같습니다.

client.ajax({
               url:'web-url',
               method: 'GET',
               headers: 'header',
               timeout: 3000
          });

요청이 NginX를 통과하는 경우 NginX 설정을 확인하는 것도 잊지 마십시오.

options.timeout nginx 해야 할 수 있습니다.nginx는 조정해야 .

https://ubiq.co/tech-blog/increase-request-timeout-nginx/ 를 참조해 주세요.

언급URL : https://stackoverflow.com/questions/5225597/set-timeout-for-ajax-jquery