使用jsonp和相同的回調函數進行多個請求

Question

嘿我想實現能夠使用jsonp和相同的回調函數調用多個請求。我現在的做法是在每次調用之間設置間隔，這很可怕，因爲如果我想進行10次請求調用，則需要10秒才能檢索所有數據。如果我縮短時間，那麼它會返回一個parseerror。

我想知道是否有任何方法可以幾乎同時發出這些請求。

這裏是我的Ajax請求調用代碼：（相關代碼）

var parameterMap = OAuth.getParameterMap(message.parameters); 
    console.log("3"); 
    $.ajax({ 
    'url' : message.action, 
    'data' : parameterMap, 
    'dataType' : 'jsonp', 
    'async' : 'true', 
    'jsonpCallback' : 'cb', 
    'cache': true 
    }) 
    .done(function(data, textStatus) { 
    console.log("Coming in"); 
    var mapIndex = yelpRequestCounter.toString(); 
    console.log("Map Index being set is: " + mapIndex); 
    yelpResults = yelpResults.set(mapIndex, data.businesses); 
     console.log("4"); 
     console.log("Success promise: " + yelpRequestCounter); 
     console.log("Ending"); 
     if(yelpRequestCounter == 9){ 
      findPriorityResuts(subPoints); 
      yelpRequestCounter = 0; 
     } 
     // console.log('success[' + JSON.stringify(data) + '], status[' + textStatus + ']'); //', jqXHR[' + JSON.stringify(jqXHR) + ']\n'); 
    } 
) 
    .fail(function(data) { 
    console.log("Failed") 
     // console.log('error[' + errorThrown + '], status[' + textStatus + '], jqXHR[' + JSON.stringify(jqXHR) + ']'); 
    } 
); 

}

我的回調函數是一個空的方法，因爲我想，如果我有取回我的所有數據在承諾中，那麼我就不會有錯誤（我錯了）。

這裏是發出請求的功能：

var generateBusiness = function(term, subPointResults){ 
    console.log("generateBusiness is being called"); 

    var waitForCB = setInterval(function(){ 
    console.log("CB Counter = " + yelpRequestCounter); 
    latlngString = subPointResults[yelpRequestCounter].lat().toString() + "," + subPointResults[yelpRequestCounter].lng().toString(); 
    yelpSearch(term, latlngString,subPointResults); 
    yelpRequestCounter++; 
    console.log(yelpRequestCounter + "---------------------"); 

    if(yelpRequestCounter === subPointResults.length){ 
     console.log("It stops!"); 
     clearInterval(waitForCB); 
    } 

    },1000); 
} 

如果我縮短了時間或者是壞連接的地方，那麼這將幾乎不起作用。

感謝您的時間和幫助！ :)

Answer 1

我相信你的問題可以通過使用Jquery的$ when（）。then（）函數來解決。

以下是您可以執行此操作的一種示例模板。

$.when(ajax1(), ajax2().., ajaxN()).then(function(response1, response2,.., responseN){ 

}); 

function ajax1() { 
    return $.ajax({ 
    url: "url", 
    dataType: "jsonp", 
    ... 
}); 
} 

function ajax2() { 
    return $.ajax({ 
    url: "url", 
    dataType: "jsonp", 
    ... 
}); 
} 
... 

編輯：另外，如果你想使用一個循環，使所有的Ajax請求，以代替編寫多種功能，你可以使用屬性Function.prototype.apply的。例如$.when.apply($, my_array);

這裏是一個示例模板。

var results = []; // results of all the ajax calls 

function getPromises() { 
    var promises = []; 

    var i = 1; 
    for (i = 1; i <= 2; i++) { 
     var count = i; 

     promises.push(
      $.post('/echo/html/', { 
       html: "<p>Task #" + count + " complete.", 
       delay: count 
      }).success(function(data) { 

       results.push(data) 
      })); 
    } 

    return promises; 
} 

$(function() { 
    $("a").click(function() { 


     var promises = getPromises(); 

     $.when.apply(null, promises).done(function() { 

      $("div").append("<p>All done!</p>" + results[0] + " | " + results[1]); 
     }); 

    }) 
}) 

HTML：

<a href="#">Make Ajax Requests!</a> 
<div></div>