unauthorize 401 for API requests

So I have this Angular 4 front-end website that works with ASP .NET Core API services to pull and push data.

I protected the API with Auth0 and when i use postman to test with the test access_token I get a 200 OK.

Now I logged in correctly from my angular 4 website and have an access_token and an id_token on my local storage. When I try to use either the access_token or the id_token as my authorization bearer header I get the 401 unauthorized response which is getting really annoying. I became an Auth0 user to have this made easier for me but right now its doing the exact opposite.

If you haven’t done so already you should follow the Calling an API step of the Angular quickstart:

https://auth0.com/docs/quickstart/spa/angular2/03-calling-an-api

The above goes through the necessary steps to register an API in Auth0 and then request an access token suitable to call that API from an Angular application. The most important part is that the authentication/authorization request initiated from the client application will have to include an audience parameter associated with the API in question.

As additional note, ID tokens are not meant to be used as a method to authorize API calls so you should focus on ensuring that the client application receives an access token suitable to call the API in question. At this time, access tokens meant to be used against your own API will be issued as JWT access tokens so if you are not getting a JWT as the access tokens it suggests that the audience is not being passed; if you already have a JWT you can also compare it to the one that works to see if it points to the possible root cause of the issue.