Auth redirect issue on Github Pages site

[saboehnke]

I am moving my site to Github Pages so I can host it for free. After moving it there I have run into an issue where the auth redirect loops and tells me that I have a mismatched redirect uri. My site is https://www.follow4follow.tv which will route you to https://www.follow4follow.tv/#/dashboard. The redirect uri is set in my site and in the Twitch dev portal as https://www.follow4follow.tv/#/dashboard/. I’m not sure what I’m missing.

[WLG3R]

the trailing slash matters. Make sure to add both versions to the redirect URL list.

[saboehnke]

I still get the same issue after adding the URL with and without the ending slash.

[BarryCarlyon]

After making the change you might need to wait 5/10 minutes for Twitch to clear any caches of your previous configuration

[saboehnke]

Yep I gave it about an hour now and I still have the same issue.

[BarryCarlyon]

Did you urlencode the redirect_uri in the outbound link to Twitch the # is probably throwing it off if you didn’t

[saboehnke]

I’ll give that a shot.

[saboehnke]

So if I url encode the redirect_uri it doesn’t seem to change anything. I still have the same issue.

[BarryCarlyon]

@saboehnke

It is as if the redirect url is just getting ignored on Twitch’s side and it returns what it wants. I can get around that by removing the production urls from the list temporarily.

When Twitch has the error of “redirect URI mismatch” I redirects to the first oAuth URL in the list. So that might be what you are currently seeing.

I’ve never used a URL with # as a URL redirect as that normally means “go to this anchor on a page”. So I wonder if you have stumbled on a unexpected outcome from using this.

Generally a URI will end with a /

So as far as I know the correct URL should be

https://www.follow4follow.tv/#/dashboard/

Having checked your dashboard it is declaring

https://id.twitch.tv/oauth2/authorize?response_type=token&client_id=kz6qzdszljw10pr9xynwv1acoo7dsy&redirect_uri=https://www.follow4follow.tv/

So it’s either not encoding the URL correct and it’s ignoring everything after the #

Since it should be

https://id.twitch.tv/oauth2/authorize?response_type=token&client_id=kz6qzdszljw10pr9xynwv1acoo7dsy&redirect_uri=https%3A%2F%2Fwww.follow4follow.tv%2F%23%2Fdashboard%2F

Which is also doing the complaining about the redirect URI

But I cannot see what your tool is actually generating, only the end result after the redirects round the houses

Can you post a screenshot of what you currently have your dashboard set to?
And make your tool spit out a link to click rather than redirecting?

[saboehnke]

@BarryCarlyon I greatly appreciate how helpful you are in these forums! I was completely missing the fact that encodeURI() was not actually encoded the redirect_uri and I needed to use encodeURIComponent() instead. I was able to get it to work after that. Thank you!

[BarryCarlyon]

Hurrah!