Call an API - Consent required

[kasperskov01]

Hello,
I am adding authentication to a simple react app and want to call a protected API. I have followed this tutorial but i get the error Consent required. I can’t figure out how to display the consent prompt. I have tried getTokenWithPopup instead of getAccessTokenSilently but it is undefined.
How can I display the prompt for consent?
Any help is appreciated!

[joseantonio.rey]

Hello, @kasperskov01! Welcome to the Auth0 Community.

This is happening because your authentication request contains a request to provide certain scopes in the Access Token, and you’re attempting to log the user in silently. If the user has not previously consented to the application to use these scopes, this issue will come in, as you are calling a non-interactive flow, and providing consent is an interactive operation.

I recommend that you use these instructions: Auth0 React SDK for Single Page Apps

Let me know if this helps.

Thanks!

[aus-it-orders]

I am having the same issue. Using React.

I have logged my user out of the app, and re logged in.

I read this thread and followed this documentation. Also this tutorial which is broken and makes no mention of a consent screen for accessing the Management API.

This code causes the “Consent required” error:

const accessToken = await getAccessTokenSilently({
  audience: "https://localhost:22522",
  scope: "read:test",
});

I have created a custom API in Auth0 with audience “https://localhost:22522” and created the “read:test” permissions also.

All I want is to have the user login and then test getting an access token from Auth0, I don’t want to have another popup giving authorization to access things as that is not up to the user. This would be an API for basic functionality of the app. Authentication should imply authorization in this case.

---

EDIT: passing in the audience and scope to the Auth0Provider component seems to be sufficient. We do not need to then pass it in again to getAccessTokenSilently(). That may be incorrect but I tested it and seem to have a value that looks like a JWT.

This worked:

<Auth0Provider
            domain={domain}
            clientId={clientId}
            redirectUri={window.location.origin}
            onRedirectCallback={onRedirectCallback}
            audient={audience}
            scope={scope}
        >
            <App/>
        </Auth0Provider>

Then later to get an access token:

    const accessToken = await getAccessTokenSilently();
    console.log(accessToken);

I seem to get a long value that looks like a long encoded string, which I can only assume is an opaque token.

---

If this is correct could you please adjust your documentation? Just… like in general coz it’s pretty terrible, but also specifically with relation to this issue. Thx.

[Davis]

Can we get some confirmation from Auth0. Is this the preferred way to accomplish this?

[Davis]

@dan.woda can someone from your team please address this?

[dan.woda]

@Davis

As Jose mentioned, a user cannot provide consent during a non-interactive flow (like getAccessTokenSilently). You will need to either use an interactive flow that will show a consent prompt, or skip user consent for first-party apps.

Note: you cannot skip consent on localhost as it is never a verifiable first party app. Although it is possible to set up a workaround to skip the consent page on localhost during development.

[tjgerk]

@dan.woda

Note: you cannot skip consent on localhost as it is never a verifiable first party app.

That seems like something that could be fixed for applications in tenants in development-mode, and would be a lot less discouraging to developers ready to leave Auth0 behind for dumb stuff like that.

[dan.woda]

@tjgerk

If this is something you feel would be helpful change to our product, you can create a Feature Request. This helps us gauge interest and track demand. This seems like a good candidate.