Having trouble looping through xmlhttprequest GET with my array, twitch project

JavaScript
1

I have an array that I want to using each value from it in my GET request. Something like this : function something(){

function something(){
    let test = ['something', 'other', ' test'];
    let httpRequest;
     function makeRequest(){
      httpRequest = new XMLHttpRequest;
      httpRequest.onreadystatechange = test;
      for(var i = 0; i < test.length; i++){
      (function(i){
      httpRequest.open('GET', 'https://test.com/' + test[i] , true);
      })()}
      httpeRequest.send();
} make Request();
}

I keep getting undefined for test[i] though, and I’m not sure if this is how to correctly pass arrays through an httpRequest either. I will appreciate any help with this.

link to codepen if it helps https://codepen.io/icewizard/pen/qpyZqa?editors=0110 .

2

You’re using an IIFE, which is appropriate, but you’re not passing in the variable that you want to cache.

(function(i){
      httpRequest.open('GET', 'https://test.com/' + test[i] , true);
})(i)  // << 'i' needs to be passed to the function
3

Yep I just saw that, but now my problem is I’m only getting the last value passed through even though its looping. I’m not sure why but I’m going to try to put the for loop over my Make Request function

4

making the for loop over the makeRequest function still only returns the last string in my array. I’m still lost on how to solve this.

5

I just made the for loop and called the makeRequest in it, then put parameters in my makeRequest function to pass in the array, in my console is very weird. It is passing me through the objects in my array, but it passes the last object twice, and then sometimes when it updates as I edit my project it returns undefined.

6

You had some things out of order and not referencing correctly. See below for modified version of your existing code, so you can see the differences.

function getStreams() {
  //let httpRequest;
  let url = ["elajjaz", "eleaguetv"];
  function makeRequest() {
    url.forEach(function(e) {
      let httpRequest = new XMLHttpRequest();
      if (!httpRequest) {
        alert("can not create http instance!");
        return false;
      }
      httpRequest.onreadystatechange = streams;
      httpRequest.open("GET", "https://wind-bow.glitch.me/twitch-api/channels/" + e);
      httpRequest.send();
    });
  }
  function streams() {
    if (this.readyState === this.DONE) {
      if (this.status === 200) {
        let data = JSON.parse(this.response);
        console.log(data);
      } else {
        console.log("problem with request");
      }
    }
  }
  makeRequest();
}
7

Yeah I had a forEach, but then I changed it to a for loop and now I’m having other issues, I’m just going to remake the whole thing because of all these bugs. It’s working now but I’m getting duplicate json responses and sometimes just get a response object with none of the users from my array, I get an object with a user called undefined sometimes.

I think I’m going to remove everything and read up on fetch or ajax since those look a lot easier to read and seem to perform better than XMLHttprequests.

10

alright. finally got it to work after 10 hours ); thanks everyone for helping.