This browser is no longer supported.
Upgrade to Microsoft Edge to take advantage of the latest features, security updates, and technical support.
![](data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='64' class='font-weight-bold' style='font: 600 30.11764705882353px "SegoeUI", Arial' width='64'%3E%3Ccircle fill='hsl(70.4, 50%, 16%)' cx='32' cy='32' r='32' /%3E%3Ctext x='50%25' y='55%25' dominant-baseline='middle' text-anchor='middle' fill='%23FFF' %3ES%3C/text%3E%3C/svg%3E)
I have an Azure App Service with an Angular App as Docker container.
Everything works fine.
Now I want to add a security layer and activate the AAD authentication in the App Service configuration.
I have added the Azure identity provider and I can login and everything works without problems for the first time.
But when I try to open the app again I am being redirect to the Azure login but after that redirected to "https://mydomain.com/.auth/login/aad/callback" and nothing happens.
On the browser console I can see the following messages.
Access to fetch at 'https://login.windows.net/...' (redirected from 'https://mydomain.com/...') from origin 'https://mydomain.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.
I have my own authentication with JWT Tokens in my angular app and don´t want to use an integrated solution for now.
I only want to use the App Service authentication as a basic authentication but it only works the first time or if I delete my browser cache.
I am not sure what I am doing wrong. Can anyone help me?
![](data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='64' class='font-weight-bold' style='font: 600 30.11764705882353px "SegoeUI", Arial' width='64'%3E%3Ccircle fill='hsl(214.4, 81%, 30%)' cx='32' cy='32' r='32' /%3E%3Ctext x='50%25' y='55%25' dominant-baseline='middle' text-anchor='middle' fill='%23FFF' %3EMT%3C/text%3E%3C/svg%3E)
Hi @sapuntp ,
Please check under the API settings > CORS > "Allowed origins" and add your Angular app hosted domain.
See also:
How can I enable CORS on my Azure app?
Fix CORS error on Angular project deployed on Azure Web App
Ways to fix the CORS error
I have already added the CORS config and tried to add the related domains and also the * as wildcard but nothing changed.
@sapuntp
Thank you for your post and I apologize for the delayed response!
When it comes to the error message that you received, I was able to find a Stack Overflow issue with the same error. It looks like one customer was using the App Service Authentication setting under Authentication/Authorization in the Azure Portal, along with their own React-ADAL npm package, which was wrapped around their application, causing conflicting issues since those two features were both using the same instance of Azure AD.
When you mentioned that you have your own authentication, can you share a little bit more detail on that? Are you authenticating users with your own authentication and the App Service Authentication?
If you have any other questions, please let me know.
Thank you for your time and patience throughout this issue.
My application has it own user registration and own user authentication.
User have to create a own user and password in my application.
Nothing is related to Azure AD in my application.
Everything is stored in my own database.
For the authentication I use a Spring backend with JWT tokens.
For now I don´t want to integrate the Azure AD User in my application.
Now I want to add the Azure AD authentication in the App Service under Authentication / Authorization in the Azure Portal.
Which means that users have to login with an independent Azure User account and after that they can access my application login form.
There they have to login with the custom application user.