Auth API doesn't recognize a scope string with replaced ":" with "%3A"


I have this code

const authParams = {
  client_id: TWITCH_CLIENT_ID,
  redirect_uri: TWITCH_REDIRECT_URI,
  response_type: 'token+id_token',
  scope: ['openid', 'chat:edit', 'chat:read'].join('+'),

const getAuthUrl = () => {
  const search = new URLSearchParams();
  Object.entries(authParams).forEach(([key, value]) => search.set(key, value));

  return `${search.toString()}`;

URLSearchParams replaces : with %3A and the final url looks like this

API server can’t recognize this encoded colon and returns an error:

{"status":400,"message":"invalid scope requested: 'openid+chat:edit+chat:read'"}

Looks like an API bug.


you are encoding the URL where you shouldn’t be/where other encoding already processed


Or don’t use URLSearchParam

With scopes you need to literally send + and : not their encoded forms.

Covered on, some really old posts after searching the forums to be sure