Announce when my channel is live on my website in an html element, using .js


#1

Hey there dev peeps, I’m trying to have a little html element in my websites header:
https://calexil.com

top grey bar

That runs a little chunk of js to find out whether or not I’m streaming, the game, and how many people are watching.

I used to have a version of it functioning fine in api v3 that looked like this:
///
(function() {

var user_name, api_key, twitch_widget;

user_name = “calexil”;
api_key = “5j0r5b7qb7kro03fvka3o8kbq262wwm”;
twitch_widget = $("#twitch-widget");

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(" Calexil is Live! Playing: " + data.stream.game + “Viewers: " + data.stream.viewers + “”);
} else {
twitch_widget.html(” Twitch Stream Status: Offline");
}
});

})();
///
But it no longer works. I read a few threads about doing this and the only one that had success so far used cron timers, endponts/json, php, and a whole buncha unnecessary steps from what I can tell.

My current attempt at porting over the old code is as follows:

///
(function() {

var user_name, api_key, twitch_widget;

user_login = “calexil”;
api_key = “THIS IS AN API KEY I GENERATED FROM THE DEV DASH”;
twitch_widget = $("#twitch-widget");

twitch_widget.attr(“href”,“https://twitch.tv/” + user_login);

$.getJSON(‘https://api.twitch.tv/helix/streams?client_id=’ +api_key + ‘?user_login=’ + user_login + ‘&callback=?’, function(data) {
if (data.stream) {
twitch_widget.html(" Calexil is Live! Playing: " + data.stream.game + “Viewers: " + data.stream.viewers + “”);
} else {
twitch_widget.html(” Twitch Stream Status: Offline");
}
});

})();
///
This throws a 401 error currently, any help would be appreciated. sorry for the formatting


#2

Helix expects your clientId to be sent as a header not as a query string argument. Additionally you have two ? In your query string causing the first part to be negated

Please refer to the documentionation for more help