Login with Twitch issue

Hi everyone,
I’m having an issue with my “local website” trying to login with twitch. I’m using the JS SDK as shown:

$(function() {

	Twitch.init({clientId: 'pr18msmhk9mv82w4d73rizb9tgzk712'}, function(error, status) {
    	if (error) {
	    // error encountered while loading
	    console.log(error);
	    }

		if (status.authenticated) {
		  $('.twitch-connect').hide();
		}

		else{
			$('.twitch-disconnect').hide();
		}

  	});

  	var login = function() {
  		Twitch.login({
	    scope: ['user_read', 'channel_read']
	  	});
  	}

  	var logout = function() {
  		//not written yet
  	}
		
	$('.twitch-connect').click(function(e){
		e.preventDefault();
		login();
	})

	$('.twitch-disconnect').click(function(e){
		e.preventDefault();
		logout();
	})
})

And when I hit the connect button nothing happens and I’m getting this error in the network manager:

Do you guys have any idea ?
(sorry for my bad english btw, do not hesitate to tell me if you need more clues)

Are there any console errors? That is just saying the download of the Twitch JS SDK failed, which is likely why you don’t see anything when you click.

Nope, there is absolutely nothing printed in the console, before and after “hiting” the connect button. Is my code correct at least ? I didn’t mention it but “twitch-connect” and “twitch-disconnect” stand for the class i apply on my buttons. I think you already all guessed that.

I do not see a redirect_uri specified on the Twitch.init() which I believe, if I remember right, is required for the authentication method. This is how I call Twitch.init():

    Twitch.init({ popup: true, redirect_uri: $.panel.config.redirectURI, clientId: $.panel.config.clientId },

Since you are trying to login, that would require verifying the identity of your application, which the redirect_uri provides.I could also be entirely wrong too :slight_smile:

It uses the URL of the page you’re on if it’s not specified. The sdk isn’t really meant for multipage apps.

1 Like

UPDATE

After many retries I managed to debug my project. I have 1 more question though:

What’s the difference between state= and client_id= in my

@Pixel state is for cross-site request forgery checking. client_id is required to identify your application to the Twitch API.

So, basicaly I’m supposed to get the ID client at https://www.twitch.tv/settings/connections ->my app registered

But what should I put in the state field ?

@Pixel That’s an exercise for you to figure out and not something prescriptive from the Twitch API. I would recommend reading up on OAuth 2 and CSRF. There are a lot of articles covering state and how to implement it properly. It’s a security concern. If you’re interested in standards, you can read about state here: https://tools.ietf.org/html/rfc6749#section-10.12

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