Javascript Fetch for TwitchTV viewer

Javascript Fetch for TwitchTV viewer
0

#1

Hi,
I am trying to use the Javascript Fetch for completing the Twitch TV challenge.
This is my code:

  var url = 'https://wind-bow.gomix.me/twitch-api/streams/' + channels[index] +'?callback=?';
  
  fetch(url).then((resp) => resp.json()).then(function(data) {
    console.log(data);
    }).catch(function(error) {
        console.log(error);
    });

I am getting 'TypeError: Failed to fetch’
Can anyone tell me what the problem is?


#2

Hey @poulamic,
the error you are getting can originate from several reasons. Since you only gave a small snippet of your code, I can;t really be sure where the problem originates from.
Have you made sure that the url you are sending in the fetch request is valid?
Have you configured the fetch request appropriately based on Twitch’s API (type of request, headers, API key)?

I would visit this thread :


#3

I’ve edited your post for readability. When you enter a code block into the forum, remember to precede it with a line of three backticks and follow it with a line of three backticks to make easier to read. See this post to find the backtick on your keyboard. The “preformatted text” tool in the editor (</>) will also add backticks around text.


#4

Hi,
I am sure that the url is valid. It fetches when I use jQuery:

var channels= ["ESL_SC2", "OgamingSC2", "cretetion", "freecodecamp", "storbeck", "habathcx", "RobotCaleb", "noobs2ninjas"];
for(var i =0; i<channels.length; i++){
  $.getJSON('https://wind-bow.gomix.me/twitch-api/streams/' + channels[i] +'?callback=?', function(data){
    console.log(data);
});

However, I am trying to implement it using javascript instead of jQuery. That is where I am running into the above problem


#5

I am redoing my twitch project, and I ran into a similar issue. I believe since fetch uses Promises, you don’t need the callback part at the end. Here is my working fetch code:

let data = await Promise.all([
  fetch(`https://wind-bow.glitch.me/twitch-api/channels/${streamer}`).then((response) => response.json()),
  fetch(`https://wind-bow.glitch.me/twitch-api/streams/${streamer}`).then((response) => response.json()),
])

#6

A post was split to a new topic: Help getting fetch to work with windblow API