Angular and .NET 6 integrated

[lahiru.gambheera]

I’m wring an client server application with Angular and .NET 6 to implement Autherization and Autherization with Auth0. Here I’m following Authorization Code Flow These are the steps that I have followed

1. Created Single page Application with Angular and added Auth0 login.
2. I logged in and fetched the access token from “getAccessTokenSilently()” method.
   when I checked with jwt.io, it says Invalid Signature.
3. Then I tried with idTokenClaims$ like this

this.auth.idTokenClaims$.subscribe(idToken => {
      console.log('Id Token: ', idToken);
      this.accessToken = idToken?.__raw;
    });

4. Then no issue from jwt.io. But .Net back end with Autorize Attribute. My Program.cs is like this.

builder.Services.AddAuthentication(options =>
{
    options.DefaultAuthenticateScheme = JwtBearerDefaults.AuthenticationScheme;
    options.DefaultChallengeScheme = JwtBearerDefaults.AuthenticationScheme;
}).AddJwtBearer(options =>
{
    options.Authority = "https://dev-fi4bsupwmm2ptx7c.us.auth0.com/";
    options.Audience = "https://localhost:7181/";
});

Error message: Bearer error=“invalid_token”

5. There is no any place to set Audience in my single page application in Auth0 side.

What can be the problem? How can I solve this?

[dan.woda]

Hi @lahiru.gambheera,

The access token and ID token are not the same thing. Your backend isn’t going to accept the ID token.

You need to pass an audience param with the request to get a JWT that your backend can consume, otherwise you are going to get an opaque token.

You can see how to add an audience param in this guide: Auth0 Angular SDK Quickstarts: Call an API

Alternatively, you can add it to the request to getAccessTokenSilently.

Hope this helps!