Angular +WebApi+Azure App Service No Authorization Header (code 401)

userha6t 0
Viewed 51

My app is an Angular 14 + .Net 6 WebApi. It is running all good locally.

After deploying both onto respective Azure App Service, it gets 401 when Angular calls backend Api which has Authorize[role].

Found a difference which the angular webapp deployed on Azure App Service has no Authorization(with jwt token) in the request header. Not sure if this is the root cause.

The header from local running when triggering the call was as below. enter image description here

And the one deployed on Azure App Service as below. enter image description here

Any help or advice would be greatly appreciated.

I see there might be an approach by using Http inteceptor adding a custom header. I would probably take that as last resort if cannot find the root cause or other solutions.

azure-appservice webapi azure-web-app-service azure angular
1 Answers

To benefit the community, the issue was resolved by cooldadtx's answer on Microsoft Q&A.

Quoting the answer below:

The authorization header is what is injected when you have successfully authenticated. How does your app get the authentication token when it runs? You either have hard coded credentials in your code to talk to the back end API or you are prompting the user for credentials and then authenticating from there. Whatever that step is isn't happening.

One thing that I would start to suspect is that your environment settings aren't properly configured. When you deploy your app to Azure you should have set up the environment under your app service's settings. The ASP.NET environment determines what appsettings.json file to read. By default it would read appsettings.json + appsettings.<environment>.json. You should confirm that your app service is using the appropriate environment and that your JSON files have been properly copied to the server and that they are configured for authentication properly. My gut instinct is that your using the wrong credentials so authentication is failing. "

KunLi added "Now I have resolved it by adding an interceptor under the hood for adding the header. "

AjayKumar-MSFT0
Related