發送多個HTTP GET請求到一個循環的API

我正在尋找一種方法來發送許多請求到一個API使用不同的API每次。我的項目的一個示例url爲： http://api.bandsintown.com/artists/Hippo%20Campus/events.json?lapi_version=2.0&app_id=music_matcher 發送多個HTTP GET請求到一個循環的API

我正在使用HTTP請求將JSON信息拖入我的腳本並完美地工作......第一次。但是，我希望能夠在網址中使用不同藝術家名稱的循環中將它稱爲50-100次（最大）（我使用BandsInTown API）。出於某種原因，當我嘗試使用一個循環多次調用http請求時，只會出現一個輸出，並且不可預知哪個元素按其順序排列（通常是與陣列中第一個或第二個元素關聯的輸出）。這是我的代碼如下所示：

// HTTP GET call to BandsInTown API 
function httpGetAsync(theUrl, callback) { //theURL or a path to file 
var httpRequest = new XMLHttpRequest(); 
httpRequest.onreadystatechange = function() { 
    if (httpRequest.readyState == 4 && httpRequest.status == 200) { 
     var data = JSON.parse(httpRequest.responseText); 
     if (callback) { 
      callback(data); 
     }     
    } 
    else { 
     alert("error loading JSON doc"); 
    } 
}; 

httpRequest.open('GET', theUrl, true); 
httpRequest.send(null); 
} 



//extracts data from api for each artist 
function parseEvent(artist) { 
var url = "http://api.bandsintown.com/artists/" + artist + "/events.json?lapi_version=2.0&app_id=music_matcher"; 

httpGetAsync(url, function(data) { 
    var numEvents = Object.keys(data).length; 

    //var events = []; 
    for (var j = 0; j < numEvents; j++) { 
     document.write(data[j].venue.name + "-> "); 
     document.write("LAT:" + data[j].venue.latitude + " " + "LNG:" + data[j].venue.longitude); 
     document.write("ARTIST: " + data[j].artists[0].name); 
     document.write("DATE: " + data[j].datetime); 
     document.write(" " + j + " "); 
    } 
}); 
} 

var artists = ["Drake", "Mac Demarco", "Hippo Campus", "STRFKR"]; 


for (var i = 0; i < artists.length; i++) { 
parseEvent(artists[i]); 
document.write(" ---NEXT ARTIST--- "); 
}

所以我無法確切說出是怎麼回事，但事情怪怪的我目前的代碼。我沒有很多的JavaScript和Web開發經驗，所以任何幫助表示讚賞！我最好尋找一種方法來實現這個純JavaScript。我很難弄清楚如何處理Eclipse Neon中的Node.js和/或JQuery（我正在使用的IDE）

來源

2016-11-26 crispEtomE

您已經很好地實現了閉包，所以這不是一個函數成功回調的問題現在覆蓋所有others.But的反應，當你看document.write()這一切變得清晰，這個函數首先擦拭你的整個內容乾淨，然後將其寫入無論你告訴它。那就是爲什麼你幾乎看不到任何人使用它

`document.write('a');` 
`document.write('b');` 
`document.write('c');` // a and b are gone you would see only 'c'

所以在循環結束之後，你只會看到最後一次調用的輸出。儘管大多數情況是隨機的，哪個調用會最後完成，但它主要偏向某個特定的值，這是由於serv ers被調整。

所以，更好的辦法是使用一些<div>什麼的，倒你的結果變成像這樣一個

<div id="op"></div>

和

function parseEvent(artist) { 
    var url = "http://api.bandsintown.com/artists/" + artist + "/events.json?lapi_version=2.0&app_id=music_matcher"; 

    httpGetAsync(url, function(data) { 
     var numEvents = Object.keys(data).length; 
     var op = document.getElementById('op'); 
     op.innerHTML = op.innerHTML + " <br><br> <h2>---NEXT ARTIST---<h2> <br>"; 
     //var events = []; 
     for (var j = 0; j < numEvents; j++) { 
      op.innerHTML = op.innerHTML + "<br>" + data[j].venue.name + "-> "; 
      op.innerHTML = op.innerHTML + "<br>" + "LAT:" + data[j].venue.latitude + " " + "LNG:" + data[j].venue.longitude ; 
      op.innerHTML = op.innerHTML + "<br>" +"ARTIST: " + data[j].artists[0].name; 
      op.innerHTML = op.innerHTML + "<br>" +"DATE: " + data[j].datetime; 
      op.innerHTML = op.innerHTML + "<br>" + " " + j + " <br>"; 
     } 
    }); 
} 

var artists = ["Drake", "Hippo Campus", "STRFKR","Mac Demarco"]; 

for (var i = 0; i < artists.length; i++) { 
    parseEvent(artists[i]); 
}

來源

2016-11-28 08:51:15 Viney

發送多個HTTP GET請求到一個循環的API

回答

相關問題