Twitch status api online/offline

Hey guys, I would like to ask for help. Back in time I got a twitch api script for showing twitch status who is online & how many viewers are watching.
But since Twitch API changed, It doesn’t work now and I’m asking for help what should I change or add to the scripts?

There is .js file which contains:
$(document).ready(function() {

$("#chg").click(function() {
    var name = document.getElementById("input").value;
    name = name.toLowerCase();
    getChannelInfo(name);
    isOnline(name);
});

function getChannelInfo(username) {
    var url = 'https://api.twitch.tv/kraken/channels/' +
        username;
    $.ajaxSetup({
       headers : {
'Client-ID': 'xxxxxxxxxxxxxxxxxxxxxxxxxxx' //bad
       }
    });        
    $.getJSON(url, function(object) {
        var iconUrl = object.logo;
        if(iconUrl !== null){$("#logo").attr("src", iconUrl);}
      else {$("#logo").attr("src","https://static-cdn.jtvnw.net/jtv_user_pictures/xarth/404_user_150x150.png")}
        $("#channel").html(object.display_name);
    })
    .fail(function() {
        $("#channel").html(username + " not found");
        $("#game").html("");
        $("#title").html("");
      $("#logo").attr("src","https://static-cdn.jtvnw.net/jtv_user_pictures/xarth/404_user_150x150.png")
      $("#status").html("")
      
    });
}

function isOnline(username) {
    var streamUrl = " https://api.twitch.tv/kraken/streams/"+username;
    $.getJSON(streamUrl, function(obj) {
      if(obj.stream !== null){
        if(obj.stream.game !== null) {
             var link = "https://twitch.tv/"+username;
            $("#game").html("" + obj.stream.game +"");
            $("#status").html("LIVE");
            $("#title").html(obj.stream.channel.status)
        }
        
      }
       else {
         $("").html("OFFLINE");
         $("#game").html("");
         $("#title").html("");
       } 
    });
}

getChannelInfo(“dreamhackcs”);
isOnline(“dreamhackcs”);
});

and in the .html file there is script /script command

(function() {
  var user_name, api_key, twitch_widget;

  user_id = "dreamhackcs";
  api_key = "xxxxxxxxxxxxxxxxxxxxxxxxxx";
  twitch_widget = $("#dreamhack_twitch-widget");
  limit = "1"

  twitch_widget.attr("href","https://twitch.tv/" + user_name);

  $.getJSON('https://api.twitch.tv/kraken/streams/' + user_name + '?client_id=' + api_key + '&callback=?', function(data) {	
      if (data.stream) {
          twitch_widget.html("<span class='online'></span> " + data.stream.viewers);
      } else {
          twitch_widget.html(" OFFLINE");
      }  
  });
})();

I would be very grateful if anyone could help.

Please refer to the migration guide

https://dev.twitch.tv/docs/v5/guides/migration

or jump straight to Helix

As per the migration guide and helix you need to declare the client_ID as a header

If you are using kraken you also need a v5 header and to use user_id’s instead of user_names.
If you are using helix you can use either user names or ID’s

Like this?

$(document).ready(function() {
url -H ‘Accept: application/vnd.twitchtv.v5+json’
-H ‘Client-ID: xxxxxxxxxxxxxxxxxxxxx’
-X GET https://api.twitch.tv/kraken/streams/

$("#chg").click(function() {
    var name = document.getElementById("input").value;
    name = name.toLowerCase();
    getChannelInfo(name);
    isOnline(name);
});

function getChannelInfo(username) {
    var url = 'https://api.twitch.tv/kraken/channels/' +username;
    $.ajaxSetup({
       headers : {
'Client-ID': 'xxxxxxxxxxxxxxxxxxxxxxxxxxx' //bad
       }
    });        

and in the script

user_id instead of user_name?

Because I’m kinda new to coding. Sorry if I don’t understand.

Heres a Fetch example

fetch(
    'https://api.twitch.tv/kraken/videos/SOMEID',
    {
        headers: {
            'client-id': 'SOMECLIENTID',
            'accept': 'application/vnd.twitchtv.v5+json'
        }
    }
)
.then(resp => { return resp.json() })
.then(resp => { console.log(resp) })
.catch(err => { console.log(err) });
1 Like

Thank you very much, but where do I put it?

It replaces the code you already have but it is not a complete example. If shows how to use fetch instead of jQuery to make the call

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.