401 Unauthorized when calling our API if the front-end is using Auth0 custom domain

We have an Angular 10 app front-end with a .Net 6 Web API backend. We are using Auth0 as the Authentication Provider. We’ve been having some clients complain (mainly on Safari browser) that they cannot log onto our app due to cross-site tracking being disabled. I read that using an Auth0 custom domain would help, as we could make it that our front-end, back-end and Auth0 are all on the same domain. So we upgraded to a paid license, and activated custom domain. However, when the user logs in now (using the new custom domain), and is redirected back to the web app after successfully logging in, as soon as the web app tries to make any calls to our API, the API returns a 401 Unauthorized response.

As far as I can see, nothing needed to be changed on the back-end API when we switched to using Auth0 custom domain. The only change that was required was on the front-end Angular app, where we had to update the “domain” to point to the new custom domain. The client id remains the same. I also whitelisted the new custom domain URL on Auth0 “allowed callback URL”, “allowed logout URL” and “allowed web origins”, just in case.

Any idea why the front-end receives a 401 Unauthorized response from our API whenever it tries to call it?

Thanks

2 Likes

Hi @fabs

This can be due to a change in iss claim inside the access token. Prior to custom domain it used to be a conical domain provided by Auth0, but now it is your custom domain. If that is the case then simply update your API to look for your new custom domain as the trusted issuer.

Hope it helps

Thanks
Jeff

Hi Jeff. Thanks for the reply. So, if I understand you correctly, in the Web API’s startup, I have the following:

services.AddAuthentication(options =>
{
    options.DefaultAuthenticateScheme = JwtBearerDefaults.AuthenticationScheme;
    options.DefaultChallengeScheme = JwtBearerDefaults.AuthenticationScheme;
}).AddJwtBearer(options =>
{
    options.Authority = $"https://{Configuration["Auth0:Domain"]}/";
    options.Audience = Configuration["Auth0:Audience"];
}

So I updated Auth0:Domain in appsettings.json to point to the new custom domain, but it didn’t make a difference :confused: not sure if I maybe misunderstood your comment?

Hi @fabs

Please post token iss and error API is throwing inside the validation (not the one you are receiving as part of response).

Thanks
Jeff

Hi @fabs
I have just the same problem with my code.
Did you solve that issue? If yes, could you please let me know how that problem was solved?

I resolved the issue. I need to change the auth0 domain used in back-end codes to the custom domain.

        services.AddAuthentication(options =>
        {
            options.DefaultAuthenticateScheme = JwtBearerDefaults.AuthenticationScheme;
            options.DefaultChallengeScheme = JwtBearerDefaults.AuthenticationScheme;
        }).AddJwtBearer(options =>
        {
            options.Audience = Configuration["Auth0:ApiIdentifier"];
            options.Authority = $"https://{Configuration["Auth0:CustomDomain"]}/";
        });