여러 AJAX는

Question

내가 checker 60 초마다과 같이라는 함수 실행을 중단하지 않고 호출

setInterval(checker, 60 * 1000); 

checker 그것이 AJAX를 통해 확인 된 URL의 배열을 가지고가, 현재의 코드는 다음과 같다 :

$.ajax({ 
    url: sites[i].url, 
    type: "GET", 
    dataType: "json", 
    async: false, 
    success: function(data){ 
    //blah blah blah 
    }else{ 
    //something else 
    }, 
    error: function(){ 
    //blah blah blah 
    } 
}); 

코드가 작동하면 JSON 결과에 따라 일부 UI 기반 항목이 변경됩니다. 내 문제는 여러 사이트를 검사하는 실행 시간이 ~ 4 초이며,이 시점에 페이지가 응답하지 않게된다는 점입니다. async: false을 제거하면 코드가 더 이상 예상대로 작동하지 않습니다.

누군가가이 문제를 해결하기 위해 콜백을 사용하여 언급했지만이 컨텍스트에서 사용하는 방법을 이해하지 못합니다.

편집

adosan에서의 제안에 따라

업데이트 코드 : 콘솔에서

function promtest(){ 
    var sites = [ 
      { name: "WorkingSite", url: "http://sitename.com/testing.php" }, 
      //a bunch more sites, 1 returns a 404 to test for failure 
      { name: "404Site", url: "http://404url.com/testing.php" } 
      ]; 

    var promiseList = []; 
    for(var i in sites){ 
    var promise = $.ajax({ 
    url: sites[i].url, 
    type: "GET", 
    dataType: "json", 
    async: true, 
    success: function(data){ 

     if(data.Response != 'OK'){ 
     console.log('Site ' + sites[i].name + ' Not OK'); 
     }else{ 
     console.log('Site ' + sites[i].name + ' OK '); 
     } 
    }, 

    failure: function(data){ 
     console.log('Failure for site: ' + sites[i].name); 
    }, 

    error: function(){ 
     console.log('Site ' + sites[i].name + ' Not OK'); 
    } 

    }); 

    promiseList.push(promise); 
    } 

    $.when.apply($, promiseList).then(function(){console.log('success')}, function(){console.log('fail')}); 

} 

나는 참조 : 사이트 이름은 항상 마지막으로 보여주고있다

Site 404Site Not OK 
Site 404Site Not OK 
Site 404Site Not OK 
Site 404Site Not OK 
Site 404Site Not OK 
Site 404Site Not OK 
Site 404Site Not OK 
fail 
Site 404Site Not OK 
Site 404Site Not OK 
Site 404Site Not OK 
Site 404Site Not OK 

하는 것으로 하나는 목록에 있습니다.

Answer 1

여기에는 Promise (https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Promise)를 사용할 수 있습니다. 예 :

function checker(url) { 
    return new window.Promise(function (resolve, reject) { 

     function successCallback(response) { 
      resolve(response); 
     } 

     function errorCallback(response) { 
      reject(response); 
     } 

     $.ajax({ 
      data: data, 
      dataType: 'JSON', 
      type: 'GET', 
      url: url 
     }) 
     .done(successCallback) 
     .fail(errorCallback); 
    }); 
} 

function checkerSuccess(response) { 
    console.log(response); 
} 

function checkerError(error) { 
    console.warn(error); 
} 

checker('http://api.example.com').then(checkerSuccess).catch(checkerError); 

Answer 2

나는 이것을 시도 할 것이다.

는의 당신은 업데이트 할 개체가 var에 foo는 것을 가정 해 봅시다 :

var foo = ""; 

$.ajax({ 
     url: sites[i].url, 
     type: "GET", 
     dataType: "json", 
     async: false, 
     success: function(data){ 

      foo = data.gottenValue1 

     }else{ 
     //something else 
     }, 
     error: function(){ 
     //blah blah blah 
     } 
    }); 

Answer 3

당신은 jQuery를 이연 메커니즘 (약속)에 내장 할 수 있습니다.

https://api.jquery.com/category/deferred-object/

jQuery.ajax 함수는 변수에 asigned 할 수있는 약속 개체를 반환한다.

https://api.jquery.com/jQuery.ajax/

var promise = $.ajax({ 
     url: sites[i].url, 
     type: "GET", 
     dataType: "json", 
     async: true 
    }); 

약속의 좋은 점은 하나 더에 여러 promisses을 결합 할 수 있다는 것입니다.

var promiseList = []; 
promiseList.push(promise); 
$.when.apply($, promiseList).then(function(){/*SUCCESS*/}, function(){/*FAILURE*/}); 

전체 코드는 다음처럼 보일 것입니다 : 잘못된 설정 :

var promiseList = []; 
for(var i in sites){ 
    var promise = $.ajax({ 
     url: sites[i].url, 
     type: "GET", 
     dataType: "json", 
     async: true 
    }); 

    promiseList.push(promise); 
} 
$.when.apply($, promiseList).then(function(){/*SUCCESS*/}, function(){/*FAILURE*/});