发送多个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

回答

相关问题