No SecurityTokenValidator available for token: <access_token>

[ayayalar]

Following the same setup,

Here is a fiddler request

Host: localhost:5000
Connection: keep-alive
Authorization: Bearer jXFxGSgB3thqIQ0O
Origin: http://localhost:4200
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/59.0.3071.115 Safari/537.36
Access-Control-Allow-Origin: *
Accept: application/json, text/plain, */*
Referer: http://localhost:4200/home/devices
Accept-Encoding: gzip, deflate, br
Accept-Language: en-US,en;q=0.8

If I subscribe to the OnChallenge event:

 var options = new JwtBearerOptions
            {
                Audience = Configuration["Auth0:ApiIdentifier"],
                Authority = $"https://{Configuration["Auth0:Domain"]}/",
                Events = new JwtBearerEvents
                {
                    OnChallenge = context =>
                    {
                        var ctx = context;
                        return Task.CompletedTask;
                    }
            };

I am getting the following error:
No SecurityTokenValidator available for token: <access_token>

[ayayalar]

I've also tried adding the following to the options,
SecurityTokenValidators = { new JwtSecurityTokenHandler() },

Same problem.

[jerriep]

@ayayalar The token you are passing is not a valid JWT. How did you obtain that token?

[ayayalar]

Token comes from the angular app authentication. Following the sample for the angular app,
This is where I store the access token after the auth redirect.

  private setSession(authResult): void {
    const expiresAt = JSON.stringify((authResult.expiresIn * 1000) + new Date().getTime());
    localStorage.setItem('access_token', authResult.accessToken);
    localStorage.setItem('id_token', authResult.idToken);
    localStorage.setItem('expires_at', expiresAt);
    localStorage.setItem('user_profile', JSON.stringify(authResult.idTokenPayload));
    this._authStatusService.setAuthStatus(true);
  }

I use the access token which is something like jXFxGSgB3thqIQ0O

[ayayalar]

this is what the auth0 config looks like in angular app

  auth0 = new auth0.WebAuth({
    clientID: '...',
    domain: '...',
    responseType: 'token id_token',
    audience: environment.auth0Audience,
    redirectUri: environment.auth0RedirectUri,
    scope: 'openid profile email'
  });

Do you see anything wrong with it?

[jerriep]

Usually the reason you would get a short access_token like that, instead of a proper JWT, is because you do not specify an audience parameter. But according you your code, you seem to be passing an audience.

Does environment.auth0Audience actually contain a value? Does it match exactly the value of the API Identifier for the API you created in Auth0?

[ayayalar]

When I use a curl command, the access_token looks quite different and it works. I am not sure what is wrong with the angular app not getting the right access_token. Any ideas?

curl --request POST   --url https://{DOMAIN}/oauth/token   --header 'content-type: application/json'   --data '{"client_id":"y6qg1","client_secret":"92LQpwyx","audience":"http://localhost:5000","grant_type":"client_credentials"}'

[ayayalar]

let me double check on that.

[jerriep]

As per my previous comment, I think you Angular app is not passing the correct audience parameter

[ayayalar]

I've hard coded the audience, still getting a short access_token

[jerriep]

Can you please check the web request being made to the Auth0 /authorize endpoint, and paste that here? Feel free to edit out information like your client_id and domain

[jerriep]

BTW, is your Client Type for the Client in Auth0 configured as a Single Page Application ?

[ayayalar]

ok got it working. So in the the quick start, the audience shows as
audience: 'https://{domain}/userinfo'

if I used audience shows in my dashboard configuration which is
API Audience http://localhost:5000

Everything works as expected.

[jerriep]

Yes, the audience should be the same as the API Identifier for the API

Glad to hear all is sorted :)

[ayayalar]

Awesome, thanks for your help Jerrie!

[jstallm]

@jerriep, is the configuration that @ayayalar demonstrates above correct for a scenario where the client application, in this case angular, is making requests to multiple different api's? I can see the above scenario working okay if there is Only 1 api, but if there are multiple different apis, then it appears then that the token would only work for 1 of the many apis. How would we go about configuring the client/server so that we can have a single token that will work for many different apis?

[jerriep]

@jstallm I am honestly not sure what Auth0's recommendation is for this. Can you please reach out to Auth0 support, as I think they will be better able to give you an answer on this one.