Stream status widget

API Migration
1

Hi everyone!

I realized with a little delay of the “migration” and my website widget stopped working all of a sudden.
I don’t understand much about coding, but I can show you what I used (and it worked fine).

Basically the widget warned with a text message if I was online, with which game and how many spectators; if I was offline it showed another message. That’s all.

$(function() {

var	user_name = "channelName";

var	userURL = 'https://api.twitch.tv/kraken/streams/ID(maybe?)';
	
twitch_widget = $("#twitch-widget");
twitch_widget.attr("href","http://twitch.tv/" + user_name);
	
	$.ajax({
 type: 'GET',
 url: userURL,
		 dataType: 'json',
    contentType: 'application/json',
 headers: {
   'Accept': 'application/vnd.twitchtv.v5+json',
   'Client-ID': 'clientIDHere'
 },
 success: function(data) {
   if (data.stream) {
		  twitch_widget.html("message <b>" + data.stream.game + "</b><span class='viewers'> message <b>" + data.stream.viewers + "</b> message</span></br><a id='openOverlay_js'><span class='online no-mobile'>message</span></a><a target='_blank' href='channelUrl'><span class='online-tv'>message</span></a>");
	  
	  $('#apriOverlay_js').on('click',function(){
				var link_="siteUrl/popStreaming.html";
				overlay(link_);
				return false;
			});
	  
	  } else {
		  twitch_widget.html("message<b>message</b></br><a target='_blank' href='channelUrl'><span class='offline'>message</span></a>");
			
	  }  
 }
});
	
});

Can you help me correct it with the right information?
Thank you a lot! :slight_smile:

2

This code suggests you are doing the call client side

Essentially for “dumb website status widgets” you can no longer do this in pure Javascript Client Side, as you need a token to call Helix with.

And you don’t want to be asking users to login each time they visit your website to see if you are live.

So now you are required to make the calls on the server/in server side scripting.

There you will either use EventSub or the API to get Streaming status, which is then stored/cached somwhere on your server, perhaps in a database.

Then, your frontend will display stream status based on the value in the database or cache, rather than a direct API call.

In this scenrario, both EvetnSub and the API calls would utilise an App Access/Client Credentials token

And here is the Get Streams Reference

And the link to EventSub, EventSub, currently, is a Web Hooks based service, so when Streams go live/go offline Twitch will tell you, so you don’t have to make any API calls at all

3

Thank you for the quick reply!

I will show your answer to whoever is competent to fix everything correctly (because I have no idea where to put my hands) :slight_smile: