Hey guys,
I am currently trying to build a panel extension that has no backend(hosted by myself or something I have to pay for).
So I have a lot of problems understanding how the authentication and authorization works.
My extension should be a simple leaderboard showing all time bits leaders and maybe longest followers/longest watchtime.
Since I have no backend but I need scopes and therefor JWTs I decided to use the method provided by:https://blog.hasura.io/best-practices-of-using-jwt-with-graphql/ (i am not using graphql)
Basically I will store the refresh token in a secure http cookie.
Hopefully this works, maybe tell me a better method if there is one.
But since I would only have the Twitch hosted iFrame: What would my redirectURI be?
Would it be a workaround to redirect to one of my github pages site and then let this have the authenticate/refresh loop running?
From my understanding I need initialize the authorization in the registered client this would get to my github pages and in case the token becomes invalid it automatically starts authorization again or do I need to check for authorization in the panel, even tho I have it running on github pages?
How would I code that?
But I am a bit confused on how this will actually work.
Only the broadcaster has to authorize the scopes.
Will it automatically update all panels shown to users or do I need to make an extra login button page for the broadcaster?
Where would I put that page? Is it config?
I realize this topic might be a bit much and confusing itself but maybe someone can help and has even some code examples
With out a backend you are making this super complicated.
Aside from the issues you have identified on what the redirectURI would be, and where/how to store the access/refresh tokens. You have no way to perform the requests needed to update the information that is stored behind the scoped keys.
The Viewer front end sure can load the leaderboard from say the config service, (can’t call Twitch API directly as that would leak credentials).
But there is no way you can automate updating of that leaderboard, without the streamer going to your config or dashboard pages (which are not open by default) to load the code and perform the update of the data (whether that’s is automatically on load or by button press it doesn’t matter).
It also won’t account well for the streamer using multiple computers. Oh you authed on your laptop when setting up the extension, well now you have to auth again on your streaming PC, (which may also invalidate the first auth on the laptop), for example.
This is a very impractical way to do this. A backend service is the preferred route for handing sensitive data and the creation thereof (access token/refresh token), and the updating of the leaderboard data you wish to collect and display
Ok I see that and I will change the purpose of my extension(though I have a very pretty HTML/css setup if someone needs it :D)
And how does this then work? Lets say I dont create any config pages but I need authorization, does the app ask anyone to authorize or first the streamer and then skips the authorization for the viewers? And what about if I create a config page can I make the autorization in that and then the viewer site is automatically open to see?
config page/view provides the buttons to a broadcaster to go do oAuth.
Viewer page has none of the oAuth stuff in it as not needed.
Each view/page of an extension is essentially different pages of a website. You can consider the dashboard and config views as pages where the broadcaster is “automatically” logged into your website via Twitch, so you have their channelID, then you can show the oAuth stuff there.
The viewer page doesn’t even have to have requestID enabled, and every viewer can be anonymous to your extension
