Insufficient Scopes for Management API in React SPA

Hi there,

I have a NextJS React SPA created using @auth0/nextjs-auth0 where I have set the audience to be https://<tenant_name>/api/v2/. I get a JWT back but when I try to include it in a request to update the logged in user’s user_metadata I’m getting a 403 response. When I try to use the token through the explorer it also tells me the token lacks both the update:users and update:users_app_metadata scopes. Is there something else I have to do to allow the SPA to make use of the Management API? Any help appreciated.

Tom

The following reference documentation would be relevant to this scenario (Get Management API Access Tokens for Single-Page Applications).

From that I would say first step is to confirm that the SPA is requesting the necessary scopes that are allowed to be requested by SPA’s for the Management API. In particular, in this situation it seems you would require update:current_user_metadata.

Can you confirm that your application requests that scope and also that the access token returned has been granted that scope?

1 Like

Hi @jmangelo, thanks for the response.

I’m not quite sure how I can make the SPA request the necessary scopes. I have the audience set in the config as https://<tenant_name>.auth0.com/api/v2/ and it returns a valid JWT but not with the correct scopes. I’ve also tried using GitHub - auth0/nextjs-auth0: Next.js SDK for signing in with Auth0 this and specifying the scope to be scope: ['update:current_user_metadata'] but when I use the returned token it only has the scopes id and openid.

I have found that in:

export default initAuth0({
  domain: process.env.domain,
  clientId: process.env.clientId,
  clientSecret: process.env.clientSecret,
  scope: "openid profile", // <----- I can specify the scope here and it'll work
  redirectUri: process.env.redirectUri,
  audience: "https://<tenant_name>.auth0.com/api/v2/",
  postLogoutRedirectUri: process.env.postLogoutRedirectUri,
  session: {
    cookieSecret: process.env.cookieSecret,
    cookieLifetime: 60 * 60 * 8,
    storeIdToken: true,
    storeAccessToken: true,
    storeRefreshToken: true,
  },
  oidcClient: {
    httpTimeout: 2500,
    clockTolerance: 10000,
  },
});

But I then end up with it on my signup input:
image

Is there something else I’m missing?

Can you clarify what’s the issue is when you add the necessary scope to the scope string in initAuth0 ? You mentioned that it works when it’s added there so what’s the issue when you add the scope there? Is the issue the fact that a consent screen is displayed?