Azure AD MSAL in iframe - azure-active-directory

I have a website protected by azure ad and uses msal, i want to access it in iframe, but it looks it does not work. Is there a way to make it work ? Is it related to the redirect url or other issue ?

You cannot authenticate the user inside iframe meaning you cannot use redirect APIs for user interaction with the identity provider.
You can start with creating your own customer page and allow the user to enter the credentials and then authenticate the user. When the user enters their credentials and clicks on login, the server will return OK (if email/password is correct). After that you should save the token in localstorage and then set isAuthenticated = true.
If you are using the Auth code flow, then you should do the authentication in the outer real page not inside the iframe. Then you will have to login once your authenticated. The concept is that you must fully redirect to the Auth pages in azure ad not in iframe.
You can achieve single sign-on between iframed and parent apps with
the same-origin and with cross-origin if you pass an account hint from
the parent app to the iframed app.
Learn more here

You need to specify in the auth config to allow redirects in IFrame
https://azuread.github.io/microsoft-authentication-library-for-js/ref/modules/_azure_msal_browser.html

Related

Navigating to deep route not working in case of Angular application

I have a angular application with URL: https://abc.xyz.com hosted within Azure App Service. This has a backend API hosted using a separate Azure App Service and different URL: https://xxx.yyy.com. Both the endpoints are registered with AzureAD. Only authenticated users can login into the application and all the requests to the API has to pass the token via the header from the frontend services layer.
Lets say there is a route within the application: https://abc.xyz.com/#!/test/100
Now when I open a new browser instance and try the above URL, it asks me to follow all the steps required for AzureAD authentication and navigates me to the landing page:https://xyz.abc.com instead of https://abc.xyz.com/#!/test/100
In this case I am expecting user to be navigated to the requested route : https://abc.xyz.com/#!/test/100 instead of taking him to the landing page: https://abc.xyz.com/ post authentication process.
Can anyone provide their guidance regarding this scenario?
Please check if below points give some idea.
AFAIK, the default behavior is to redirect the user to the original
page i.e; the redirect url mentioned in the app registration process,
as microsoft identity basically checks the state whether is protected
by Azure AD before the location is changed to other path than that.
Please check this blog on Redirect to a custom login page when
securing your Angular app with MSAL - Waldek Mastykarz to try the
page redirect to the path previews required.
You may also try adding another redirect url of that path in azure
ad portal.

React.js msal ad authentication directly without any login button

Has anyone of you seen any example or documents how to do AD Authentication in React.js Application that does not use any Login buttons when User is all ready Authenticated?
I have look many Authentication samples like Microsoft's https://learn.microsoft.com/en-us/azure/active-directory/develop/tutorial-v2-react has but everyone of them has a Sign-in and Sing-out Buttons not automatic Authentication and redirect if User has all ready logged in and Authenticated. I mean something like SSO style AD Authentication that is usually wanted to Customer's Web Applications. I use MSAL packages.
Any help valued.
Thanks
You can use the localStorage or cookies to store the localStorage or cookies to store the token, and when you reload the application then you can check if the token is valid and available in localStorage or Cookies, if it is then redirect the user to the home page otherwise redirect the user to the login page.
In the MSAL browser, acquireTokenSilent get's refresh token on every call to the token end point. The very first refresh token has a duration of 1 hour. Subsequent refresh tokens all have reduced (the remaining) expiry time.

Authenticate in Identity with an external login page

So, we are developing a public rest api that is protected by our own Identity server through an authorization code flow. Somewhere in the middle of the flow, we also implemented a consent step (with a different web app) to grant the Api access to some data that belongs to a user's account of another web app of our own. Currently, the consent page is protected by OpenIdConnect, which login page is implemented in the Identity server itself. However, we want expose as little as possible of the Identity server to the public.
With that in mind, is it possible to implement a login page outside of the Identity server that can still authenticate the user in identity and grant the consent? If so, how?
I will start with just explaining the flow.
When an app redirects a user to Identityserver, they come to authorize endpoint to validate the request.
When request is not valid, that triggers an error.
When request is valid and user is authenticated (has auth cookie) they just go back to the client app with the code.
When request is valid and the user is not authenticated, the next redirect would be to login page. It is the place to check the credentials, set the cookie (for the Identityserver app) and redirect back to the authorize endpoint to go further with consent or final redirect to the client app.
Is the answer crystal clear already? Login page is almost the only vitally needed for Identityserver to make possible setting the auth cookie for any further SSO.
Nevertheless you can delegate the login handling to an external app (one more Identityserver instance?). In that case your front login app will perform the steps (1-2-3-4), set the first level cookie, redirect back to the client Identityserver app, which will set the second level cookie on external auth callback action and finally redirect to the original caller. Is this the scenario for you? Possibly so. The original explanation is a bit uncertain.

Azure OAuth authentication from C# console application

I want to login into https://lcs.dynamics.com from a C# console application.
When you navigate to lcs.dynamics.com, it redirects to https://login.microsoftonline.com/common/oauth2/authorize
Here I enter a username as xyz#contoso.onmicrosoft.com and the password, system authenticates and redirects to lcs.dynamics.com
For this to work in my Azure Active Directory, I have created an Azure AD Web API application with the redirect URL as https://lcs.dynamics.com
I tried both approaches, creating a native application and authenticating using username and password as well as a Web API and authenticating using a secret key.
In both cases, I do receive an auth token which I parse as Bearer <auth_token> and set as the header value but when I make the HttpRequest, the response is still the login page instead of it moving ahead.
What am I doing wrong here?

OAuth2 in Silverlight

What do you think about this approach?
1. A single server for OAuth authentication and resource server, based on dotnetopenauth.
2. Silverlight and javasrcipt interaction to access the OAuth Authorization endpoint.
e.g
Login button in silverlight page calls a javascript function to access the Authorization endpoint in server using implicit grant.
Server redirects to login page.
User selects open id provider, login, and approve application request to access user's openid.
User access the OAuth Authorization endpoint.
Server redirect user to silverlight page again with access token in url fragment.
javascript parses the url fragment to get the access token
when silverlight page is loaded, silverlight app calls javascript function to get the accesstoken.
Silverlight uses the access token to access the resources.
Seems reasonable to me. :)
DotNetOpenAuth won't run in Silverlight, but OAuth2 clients are very simple anyway, so I don't think that should hold you back.

Resources