Im stuck at the api call for twitch.tv…
can anyone please tell me what is the error:
$(document).ready(function(){
var url=“https://wind-bow.gomix.me/twitch-api/streams/freecodecamp”;
$.getJSON(url,function(data1){
if(data1.stream===null){
$(“fccstatus”).html(“FreeCodeCamp Is Currently Offline”);
}
else{
$(“fccstatus”).html(“FreeCodeCamp Is Currently Online”);
}
})
});
I just finished with this challenge yesterday. Since I can’t see your code and I don’t know what particular problem you are facing I’m going to make a couple of guesses.
Guess #1 - Is fccstatus a class or id? If so it needs to be $(".fccstatus") or $("#fccstatus").
Hey. You are nesting asynchronous requests and for loops. The loops will not wait for the requests to be finished so while “data2” is being requested, the loop continues until the end, therefore “following[i]” will always be the last one.
A solution would be to declare your url outside of the loop and then attach the followers’ names to it inside of the loop. You don’t need two loops and you need to make another request to check if those followers’ channels are online. Also, try using more descriptive variables’ names; it’ll help you debugging any issue more easily.
I found your codepen (next time link it yourself, it’ll be easier for you to get help), refactored your code to make it work and added a bunch of comments below. Click the spoiler to see the code only if you can’t get to the solution on your own:
$(document).ready(function(){
var masterChannel="freecodecamp"; // The channel to get the followers from
var followersUrl="https://wind-bow.glitch.me/twitch-api/users/"+masterChannel+"/follows/channels"; // URL to get the followers
var channelsUrl="https://wind-bow.glitch.me/twitch-api/channels/"; // URL to get channel's info
var streamsUrl="https://wind-bow.glitch.me/twitch-api/streams/"; // URL to get stream's info
$.getJSON(streamsUrl+masterChannel).done(function(live){ // Get stream's info for master channel
$("#fccstatus").html(!live.stream ? "FreeCodeCamp Is Currently Offline" : "FreeCodeCamp Is Currently Online");
}); // End Get stream info
$.getJSON(followersUrl).done(function(followers){ // Get followers
for(var i=0;i<followers.follows.length;i++){ // Followers' loop
var followerName=followers.follows[i].channel.name; // Name of each follower
$.getJSON(channelsUrl+followerName).done(function(channel){ // Get channel's info for each follower
var channelUrl = channel.url; // Channel's URL
var channelName = channel.name; // Channel's name
var channelUsername = channel.display_name; // Channel's display name
$.getJSON(streamsUrl+channelName).done(function(live){ // Get stream's info for each follower's channel
var status = !live.stream ? 'offline' : 'online'; // If .stream isn't null\false it's online, otherwise offline
$("#followerinfo").prepend( // Prepend the HTML
"<div class='row well'>"+
"<div class='col-sm-4'>"+channelUsername+"</div>"+
"<div class='col-sm-4'>"+
"<a href="+channelUrl+">"+channelUrl+"</a>"+
"</div>"+
"<div class='col-sm-4'>"+status+"</div>"+
"</div>"
);
}); // End Get stream's info
}); // End Get channel's info
} // End followers' loop
}); // End Get followers
});
Thank you very much for the answer…But I’m Getting an error stating :server responds with 403()…
When I googled it people said it was cors problem. Should i add a callback after the api link…
here is the error:
I have one more error. When I just copied and edited for live channels an error is shown.I just edited the display like
if(status===“Online”){
then display it;
}
But a 404() error is thrown.Please Help me Out.