topic Spotify OAuth Scope Parameter Not Included In Authorisation URL in Spotify for Developers

Spotify OAuth Scope Parameter Not Included In Authorisation URL

Tommyboy0797 — Tue, 27 May 2025 15:19:07 GMT

Hi everyone,

I’m working on integrating Spotify OAuth login into my React app. I want to request multiple scopes including user-read-email, user-read-private, and user-follow-read. However, when I build the authorization URL and redirect the user to Spotify’s login page, the URL only contains the first two scopes (user-read-email and user-read-private). The additional scopes I add (like user-follow-read) never appear in the URL query parameters.

I have tried:

Hardcoding the scopes string
Changing the order of scopes
Logging the constructed URL before redirecting, which still shows missing scopes
Using URL and URLSearchParams objects to build the URL as well as manually constructing the URL string
Testing in different browsers and incognito mode
Verifying the scopes are enabled in my Spotify Developer Dashboard app
Confirming my redirect URI exactly matches the registered URI in Spotify Dashboard

Here is a simplified example of the code I’m using to build the URL:

const CLIENT_ID = '...'; const REDIRECT_URI = 'http://127.0.0.1:8000/callback'; const SCOPE = 'user-read-email user-read-private user-follow-read'; const AUTH_ENDPOINT = 'https://accounts.spotify.com/authorize'; const authUrl = new URL(AUTH_ENDPOINT); authUrl.searchParams.set('response_type', 'code'); authUrl.searchParams.set('client_id', CLIENT_ID); authUrl.searchParams.set('scope', SCOPE); authUrl.searchParams.set('redirect_uri', REDIRECT_URI); authUrl.searchParams.set('state', crypto.randomUUID()); console.log(authUrl.toString()); // Scopes missing here too window.location.href = authUrl.toString();

Despite this, the scope parameter in the URL only includes the first two scopes, and the third scope (and any others I add) are missing.

Has anyone else encountered this? What could cause scopes to be omitted from the authorization URL when building it in React? Any tips or ideas to debug this would be appreciated!

Thanks in advance.