Is their any Angular 2/4 library/Sample Code available for creating token for Client credential authentication in Azure Active Directory?
Related
We are running an API that is configured for and secured by Azure AD. This is working for us with an Angular app where users login interactively.
Now we have a need for a partner firm to use the API in a system to system way (no user login).
What needs to be configured for their application to get an OAuth token for our API from Azure AD?
I've examined the service to service call flow, but I'm wondering if it's best practice to create an application registration in our tenant for an application we don't own/manage. However this seems to be the fastest way to give them a client ID/Secret in order for them to interact with Azure AD.
Thanks in advance!
-Doug
Azure active directory supports the OAuth 2.0 to authorize the
third-party apps too. It doesn’t actually matter where the web APIs
are hosted.You can even see Azure Active Directory
recommendation on third party apps. It actually adds up security
and different type of apps can be integrated .
But you will need to have your web app authenticate to Azure AD, and
provide the token to the web api.so it requires app registration .
Scenario for external web app to call a web api, you can refer to
this:web-app-call-api
Your application can acquire a token to call a web API on behalf of
itself (not on behalf of a user) i.e; you can achieve scenario where
non-interactive app calls a web api
But if you meant app calling a partner api using another api .
The Azure AD V2.0 doesn't support the Partner API(See Restrictions on services and APIs) when you integrated the web API with third-party application using MSAL(Azure AD V2.0 endpoint) .
One way is using the on-behalf-flow. Here third-party application initially acquires the access token to call the web API. This web API acquire the token for Partner Center API and calls it using on-behalf-flow with that token. This solution uses the Azure AD endpoint instead of v2.0( register the app on Azure portal).
Other References:
asp.net web api - Azure Active Directory Verify Access Token in Web
Api outside of Azure - Stack Overflow
Authentication vs. authorization
I have a separate structure for backend using GoLang Gin and frontend ReactJS and would like to integrate the Azure AD Oauth2 login.
However, it's ok to authenticate GoLang App or React App, but how to pass the auth info to the backend when I authenticate in frontend using msal-react?
In my current backend API, I use JWT like this to protect APIs:
v1.Use(jwtauth.JWTAuth())
or should I authenticate the backend and pass the info to frontend? but I cannot get it to redirect(Azure login) since they are in different port...
Thanks!
The typical pattern is:
Front-end (React app in your case) uses msal (or other compatible library) to redirect the user to login
Front-end acquires access token for back-end using a scope defined in API app registration (or same app registration)
Front-end attaches access token to back-end requests
Back-end validates access token (signature using public keys from Azure AD, expiry time, audience, issuer, scopes etc.)
In .NET we configure an "authority" for JWT authentication, e.g. "https://login.microsoftonline.com/", and the authentication handler then downloads metadata + public keys from "https://login.microsoftonline.com//.well-known/openid-configuration".
It might be possible to configure something like this for your library as well.
Scopes you typically have to check yourself.
I've got a .NET Core application authenticating via Azure B2C however I now want to authenticate the REST API calls in Javascript using the bearer token.
The REST APIs (Azure Function) exist at a different URI to the Web Application hence another Azure Application has been created to support and linked to the existing Web Application as per the Microsoft KB's
Obviously the Javascript REST API needs to pass the authorization header along with the bearer token.
I'm trying to plumb the MSAL JS library using Msal.UserAgentApplication and call the acquireTokenSilent.
Is this the correct approach? Or should the Web App share the token from ASP.NET into JS by some means.
Components:
HTML, Bootstrap, AJAX Single Page Application (SPA) --> Deployed on-premise on tomcat 1
Azure Application Proxy 1 fronting SPA with pre-authentication as passthrough
REST API (API) --> Deployed on-premise on tomcat 2
Azure Application Proxy 2 fronting API with pre-authentication as Azure Active Directory
Microsoft MSAL Javascript library: https://github.com/AzureAD/microsoft-authentication-library-for-js
Flow:
User accesses SPA using Application Proxy 1 external URL eg. https://appProxy1.com/spa
The SPA has a sign-in button, when clicked invokes the Microsoft js MSAL library.
The user is presented a pop-up and upon entering credentials, is authenticated against Azure AD and an OAuth token is fetched.
Once authenticated successfully, the user is allowed to perform search on the SPA.
When the user searches, the SPA invokes the REST API using the application proxy 2 url eg. https://appProxy2.com/rest/.search
The REST call is blocked by browser due to CORS. It seems that Application Proxy/Azure AD is not allowing cross origin calls.
Note:
CORS has been enabled in the REST API code and SPA is able to invoke the REST API if Application Proxy 2 pre-authentication mode is set as passthrough.
I have gone through https://learn.microsoft.com/en-us/azure/active-directory/manage-apps/application-proxy-understand-cors-issues. This workaround is possible if HTML application and REST service are deployed on the same application server.
Question:
Is there any option to enable/configure CORS on Application Proxy.
Currently there is no way to configure/enable the CORS on Application Proxy.
There a user voice request for CORS App Proxy. Please feel free to up vote this user voice request.
Is it possible to have an ASP.NET Core 2 with Angular 5 and Azure AD Authentication? What I mean is implement the AD Auth using ASP.NET Core 2 and when the authentication is successful, then redirect to the Angular 5 app with some claims and tokens so that any calls to an ASP.NET Core API from Angular will include the authentication token/claims.
I know there is the ADAL angular wrapper you can actually implement the Azure AD Auth, but just wanted to know if my scenario could work...
You can, I have an app doing that now. Basically your Angular frontend will redirect the user to login at Azure.. Azure will then redirect back to your angular app with the token. ADAL plugin should snag that token from the callback URL. You then make the API calls with the Token. The .Net Core backend will verify the token with Azure.
So think of it this way: User -> AngularApp -> Azure Login -> AngularApp w/token -> API Call to backend w/token -> API Backend verifies token with Azure each call