How to Secure a Blazor WebAssembly App Using Azure Active Directory
Vložit
- čas přidán 24. 06. 2023
- In this video, I'll guide you through the step-by-step process of securing your Blazor WebAssembly app with Azure Active Directory.
Subscribe for more content like this: czcams.com/users/TechWithPat...
Support the channel: www.buymeacoffee.com/itsmepat...
Learn more :
learn.microsoft.com/en-us/asp...
Where you can find me:
💻 Github: github.com/techwithpat
🌐 Website: www.techwithpat.com
🕴️ LinkedIn: / patrick-tshibanda-4310...
#Blazor #WebAssembly #Azure #ActiveDirectory #Security #Tutorial #HowTo #StepByStep #Guide #Authentication #Authorization
Thank you, this is a very good explanation of exactly what i need.
Could you do another video on passing the ad credentials to an API having it's own app registration?
🙂it was really nice to know. Thank you for this valuable teach
extremely good.
This is great for .NET 7. Would even better if it covered .NET 8
Very good video.
Can you please create a tutorial of using Azure Active Directory for both Blazor serve and WebAssembly in .NET 8?
Kann dazu nur Ja sagen. zu beiden Aussagen.
Can you make a video of creating CustomAuthendicationStateProvider in MSAL Authenticated Blazor wasm Application(without any super user). I was just trying to add some details of the user from my Db into the AuthendicationState. So I'm planning to add that after getting the token email everything from Azure Add & later made a request to my api to get the data to Add in Authendication State. please help me .
This was great! But can someone advise me here, im not too sure where to start searching this but I want to achieve this workflow:
I have a blazor web assembly app
I have an azure functions app
user logs into web assembly app, and then with that same token, makes authenticated calls to the azure functions app. How would i set up this workflow? where would i start to look?
I am getting when registering the policy
Warning CS8604 Possible null reference argument for parameter 'value' in 'bool string.Contains(string value)'
Looking for the source code? grab it here: bit.ly/3NppZia
Thank you for the video, it works for me. I have a question. How I can add an audience using AddMsalAuthentication? With AddOidcAuthentication I can set my API as audience but I cannot find this option in case you shown.
I think you should be able to add additionnal configuration in the "AddMsalAuthentication" :
options.ProviderOptions.DefaultAccessTokenScopes.Add("{TENANT}.onmicrosoft.com/{SERVER API APP CLIENT ID OR CUSTOM VALUE}/{DEFAULT SCOPE}");
thank you!
First let me say Great video.
My project is a Blazor Server application, can i use this method on that?
And if you could tell me how to show the user email also in the mainlayout file next to name, that woild be great.
You can certainly adapt the concept discussed in the video for a Blazor Server app. To display the user's email address, you'll need to retrieve the email claim. One way to achieve this is by using a cascaded parameter of type Task which provides you with the user's ClaimsPrincipal.
For an example, you can refer to this blog post: trystanwilcock.com/2022/02/06/how-to-get-the-current-user-in-blazor-c/?
It demonstrates how to work with user claims in a Blazor application."
With exactly this configuration, how can i get the access token?
I think that there have been changes to how Active Directory makes group claims available, is there anyone who's able to get the superusers claim in this case to work? The option for Manage > Token Confirguration is no longer even available in the App Registration within Azure AD B2C. I've gone through the debugger and confirmed that the line 23 in Program.cs does not actually ever trigger the c.Value.Contains(builder.Configuration["groups:superusersid"]);, as c.Value will no longer include the group claim.
Anyone have a fix?
I faced the same problem now and found the fix. Looks like group membership claims are not included in the token by default by AAD and needs to be opted in by the developer. In the client app registration, go to "Token Configuration" section and click on "Add groups claim" and choose "Security groups" in the Edit groups claim blade. Save and run the app again, the groups are now available in the code!
Is there a way to do this with a custom login page and domain instead of Microsofts page?
Unfortunately, no
Thankfully, no.
So, is the Active Directory service free? Is it within the scope of free 12 months? (The name of the new service is Entra ID.)
Are you sure what you are doing is correct? Since the whole wasm application runs in de browser, you cannot assume that your authorizedRoute cannot be bypassed. Authorization checks should be done server side. I’m new to blazor so maybe that’s what is happing but you also didn’t checked “aspnet hosted” at project creation, so I fail to see how this can work as it’s a static spa app
Have you tried?
Security involves both Authentication and Authorization.
App authentication is managed by AAD. When a user accesses the app, they are redirected to the Azure AD sign-in page. After successful authentication, Azure AD issues two crucial tokens: an authentication token and an access token. These tokens contain vital user information and details about their authorization level.
Authorization checks should be carried out on both the client side and the server side.
But, since the tutorial is centered around a Blazor WebAssembly App, authorization is evaluated on the client side through components like CascadingAuthenticationState.
If I had used a backend API, I would have included the access token so that the server would have the information to perform the authorization.
@@TechWithPat
I’m not questioning Microsoft’s authentication. Just saying client side authorization checks are not secure.
@@mustafasabur Client-side authorization alone is insufficient, I agree. Nevertheless, the video intends to showcase client-side authentication and authorization. The static single-page application (SPA) can communicate with a web API, which means authorization verifications will occur in the API endpoints accessed by the app (beyond the tutorial's focus)
@@TechWithPati'll piggyback this conversation to ask how I would be able to send the token from my wasm page to my API. I've been trying all sorts of things but can't find something that works.
@@stoef You can use an AuthorizationMessageHandler to attach acces token to outgoing request.
learn.microsoft.com/en-us/aspnet/core/blazor/security/webassembly/additional-scenarios?view=aspnetcore-7.0