Twitch JS SDK troubles

[phosphorcat]

Hello, I am trying to make an overlay for simple follower alerts. I intend for it to be a single HTML file that I open locally in the OBS browser source plugin.

I am testing the usage of the Twitch JS SDK, and in this example for debugging (basically copy-pasted from the Twitch JS SDK wiki), I continuously get error 400, no client ID specified, however I have registered my application on the Twitch connections menu and use my client ID in the below code? (Omitted for privacy)

What am I doing wrong? I intended to get follows, as you can see in the commented out code.

Twitch.init({clientId: '*************'}, function(error, status) {
  if (error) {
    // error encountered while loading
    console.log(error);
  }
  // the sdk is now loaded
  if (status.authenticated) {
    // user is currently logged in
  }
});
Twitch.api({method: 'channel'}, function(error, channel) {
  console.log(channel.stream_key);
});
//Twitch.api({method: 'channels/:phosphorcat/follows', params: {limit:25}, verb: 'GET'}, function(error,list){
//	if (error){
//		console.log(error);
//	}
//	console.debug(list)
//});

[3ventic]

You should only be using Twitch.api if user is logged in. Unauthenticated requests with the JS SDK fail, as it does not send the client ID with its API requests, only the user’s oauth. This is due to being from a time when jsonp had to be used (headers impossible) and the client_id query parameter had a different use on the streams endpoint.

For follower alerts to be used with browser source in OBS, you’re probably better off with basic $.ajax from jquery, or possibly even XHR or fetch.