Cannot get desired scope from react-auth0 getAccessTokenWithPopup

Hi all,

I have a hard time understanding how API/scopes work, and I was hoping to get some help from you.

Actually, I have a running SPA application and a corresponding “machine to machine” API application linked (not even sure if the term is correct) to the auto-generated “Auth0 Management API”:

For testing purpose, I granted all the rights to that API, including the two rights I am interested in:

In my React app, I get a token from that API specifying the scope I want:

	const accessToken = await getAccessTokenWithPopup({
		audience: `https://${process.env.REACT_APP_AUTH0_DOMAIN}/api/v2/`,
		scope: 'update:prompts'
	});

And when I parse the token retrieved, I am clearly missing the wanted scope:

I thus cannot update the login interface labels with that token (my final goal).

In another hand, the token generated by the auth0 website for the API Explorer Application contain the wanted scope and I can update the said labels with it, so I am clearly doing something bad when retrieving a token programmatically… but what? :frowning:

Hello,

Due to security reasons, the Management API scopes and endpoints are limited for Single Page Applications:

Management API Access Tokens for SPAs > Available scopes and endpoints

To get an Access Token with the required scope, you will need to use the client_credentials flow as explained in the Get Management API Access Tokens for Production article.

The easiest way to implement the Client Credentials Flow is to follow our Backend Quickstarts.

I hope this helps!

1 Like

Thank you very much. I was hoping to be able to get the specified accesses fro my front-end, but indeed, that won’t be that much harder to do it from the back-end. Thank you very much for the explanation :slight_smile:

1 Like