Context:
I have an MVC application, which uses OWIN, and connects to Azure for authentication. It stores a token in the cookie.
I have another application that is an angular spa application. This also connects to Azure for authentication. It stores the token in localstorage. (msal library)
Issue:
When I login to the MVC app first and open the spa app and click on login it again asks for credentials and vice versa.
This is due to different storage I believe.
Question :
How can the above issue be resolved? If it's not possible,
is there any other js library that will allow me to solve this?
Other inputs:
Msal silent token works on local storage, no issue on that.
Make sure you register both applications under your B2C tenant. You can test your storage theory easily by publishing another MVC application and seeing if the SSO works between that application and your existing one.
Whether it's a single page angular application or an MVC application shouldn't affect whether the user can SSO into both of them. Ensure that the user is added in your AAD and if you want to be on the safe side you can add the user manually to both application.
Please see this relevant Github repository. https://azure.microsoft.com/en-us/resources/samples/active-directory-b2c-javascript-angular2-4-spa/
Related
I'm developing a web application with a ReactJS front end and a .NET Core 3.0 backend. To create it, I followed this tutorial, pretty much: https://learn.microsoft.com/en-us/aspnet/core/security/authentication/identity-api-authorization?view=aspnetcore-3.0 .
Currently I'm storing the users in a database hosted in Azure cloud. In the backend code's ConfigureServices() method in the Startup class, I connect to my database like this:
services.AddDbContext<ApplicationDbContext>(options => options.UseSqlServer(Configuration.GetConnectionString("DefaultConnection")));
Now, management wants to make the change so that the users are not stored in our own database but rather in Microsoft Identity (formerly called Azure Active Directory (Azure AD)). This is because lots of companies already have user accounts there and they wouldn't have to create new users.
Can someone tell me how I can transition to that destination from where I am now? I see some tutorials where I create a web application like that from scratch but I have the feeling I could change just a few lines of code of what I already have and make this change. Anyone?
I'm not sure if you only need to change just a few lines of code, but based on your requirement, you are looking for a way to integrate Azure AD Authentication into your ReactJS application to call your backend API application which is protected by Azure AD.
There are two steps:
1.Protect your webapi(server) with azure ad. You can refer to this step (TodoListService).
2.Get access token from your react app(client), then access webapi with the token. You need to register the client Azure AD app with adding permission to access the webapi application. See this step (TodoListClient).
There are no ready-made code examples for you to use directly. But you can refer to this tutorial and source code on how to use MSAL with React to call Microsoft Graph.
The only thing you need to modify is calling your own API instead of calling Microsoft Graph here.
We have a SPA(Single Page Application) with a .net core web api backend.
We want to use Azure AD for the authentication and authorisation as we will have at least 3 separate clients using AD, but looking online there is no definitive approach and its like piecing together a 50,000 piece jigsaw!
I have setup the azure api with Authentication and Authorisation, as shown in the image below, but is this the right place? as I believe I want this in the web API code, so I can then get the claims (permissions/roles) specific to the application.
There is mention of Identity but do I want to use Identity? as this sounds like it is your own database and not AD.
Should we be using B2C or B2B authentication? and does this support authorisation, as the end goal is to definer custom claims specific to the application, so we can grant and deny specific actions.
What you are using now is the built-in authentication for Azure App Service. You can sign in users and access data by writing minimal or no code in your web api. But it is not appropriate for complex scenario.
As you want to custom the application permissions/roles to specific users, it is recommended that you protect your webapi with Azure AD yourself. It is more flexible to custom your authentication. You can refer to this sample,the TodoListService part.
Should we be using B2C or B2B authentication?
Azure AD B2B is not a separate service but a feature in Azure AD.
Azure AD B2C is an independent service for building a consumer application identity repository. If you need a service to handle email or Facebook login – it is there for you.
Based on your description, I guess Azure AD is your option.
Reference:
Add authorization using app roles & roles claims to an ASP.NET Core web app thats signs-in users with the Microsoft identity platform
Compare B2B collaboration and B2C in Azure Active Directory
I watched this video on pluralsight
https://app.pluralsight.com/library/courses/authentication-authorization-aspnet-core/table-of-contents
This helped to make a bit more sense of it, actually near the end he shows that you can just create a .net core web app and then change authentication and choose a multi Azure AD option as shown in the below example. This then just works out the box! Not fully for a Vue Single page app though which is still a problem.
I have created a web application through visual studio and used the options to authenticate my user with Azure automatically.
I want to make requests to Azure as the application, how do i do this?
So far I've tried using restSharp and making requests but it is asking for headers.
(I've not posted any code as I'm not sure where to find the information)
You need a service principal.
Go to App Registrations, register an app, generate a secret, and then you can use that secret + app id, to get a token as the app.
The app registration will appear as an identity, so you can assign access to it.
https://learn.microsoft.com/en-us/azure/active-directory/develop/quickstart-v1-add-azure-ad-app
If you are hosting your web app as an App Service, you can use Managed identity, it will basically create an identity together with your app service, and then at runtime, it will have the secrets inside of environment variables. So you don't need to do app registration or secrets management.
https://learn.microsoft.com/en-us/azure/active-directory/managed-identities-azure-resources/overview
A good example of how the entire flow looks is the key vault guide. The app calls Azure services(or specifically key vault) as itself, not as an user that is using the app.
https://learn.microsoft.com/en-us/azure/key-vault/tutorial-net-create-vault-azure-web-app
We have an old application which developed on Asp.net MVC 3 I convert it and update from 4.0 to 4.6 framework things are working pretty good. Just got one more request to convert the application to use Azure Active Directory authentication. We are using form authentication right now.
The issue I am having is the application is so huge, and the application has its custom roles and authentications for every single page.
So what I am trying to achieve register app on the Active directory and when a user opens my application it redirect it to office 360 login, and he can log in there and redirect to the application and return me his email address. After that, I can verify the user and log in it to the application from the backhand code using old form authentication and create session etc.
If you're looking for a starting point, here are a couple of relevant samples that work with ASP.NET MVC web application using Azure AD for Authentication.
Additionaly, to tackle the custom roles that you mention as part of your current application, you could look at using Application Roles supported by Azure AD and also Security Groups which is what these samples show.
Authorization in a web app using Azure AD application roles & role claims
Authorization in a web app using Azure AD groups & group claims
Here are similar SO posts where I've covered a little bit more detail on the claims and implementation which you may find relevant.
SO Post 1
SO Post 2
We currently have an ASP.NET Core MVC app in combination with IdentityServer4 for authentication. The user authenticates via IdentityServer (with the HybridAndClientCredentials flow) to ADFS before it has access to the MVC application.
The SignInScheme on the MVC client is set to the values "Cookies".
We would like to extend our MVC app to host multiple Angular apps. Sometimes even more than 1 Angular app per MVC view.
The angular apps will call seperate ASP.NET Core Web API's on behalf of the user.
My question is how does the angular apps know that the user is already authenticated in the MVC application, retrieve the access token and call the API's on the user behalf?
I have been playing around with solution Scott Brady came up with but there seems no integration between the MVC app & Angular app. The Angular app will try to authenticate to identityserver and expect a callback on a particular page.
I am looking for a solution how to share the accesstokens between the MVC app and the angular apps but I am stuck. Any help is much appreciated.
If they have to sign in via the server-side hybrid flow already then the simplest way would be an endpoint in your MVC app that is cookie-secured that the client side app can call to get the access token.
Another approach is to use oidc-client-js and have the client side Angular app obtain its own token.
You could abstract this away from the client side app itself so it's easy to change the mechanism later if you need to. As it happens we use a combination of server side and client side flows and it works fine.