Blazor Authentication Tutorial - How to Authorize in Blazor [Blazor Tutorial]
Vložit
- čas přidán 20. 08. 2024
- 🌟 Get Source Code by Supporting on Patreon: / codingdroplets
🔗Blazor Tutorial Series Playlist link:
• Blazor Tutorial - Begi...
In this comprehensive Blazor Authentication Tutorial [Blazor Server Authentication Tutorial] which is a part of our Blazor Tutorial Series, we dive into authentication and authorization methods. In this Blazor login tutorial (blazor login example), we explore how to authenticate users and implement authorization using Blazor's built-in features. This video clearly explains How to authenticate in Blazor and How to Authorize in Blazor.
Blazor Authorization Tutorial:
Learn how to authorize [Blazor Server Role Authorize] in Blazor and utilize Blazor server authentication to secure your web applications effectively. We cover various authentication methods in Blazor, including Blazor server authentication and custom authentication without Identity. Additionally, we demonstrate how to use the Blazor authorize attribute for role-based authorization. Follow along as we guide you through Blazor authentication and authorization tutorials, providing a sample Blazor web app to illustrate concepts. Whether you're new to Blazor or seeking to enhance your knowledge of authentication and authorization in Blazor, this tutorial (Blazor Server Authorize) has you covered.
Blazor Cookie Authentication [Blazor Server Side Cookie Authentication]:
We'll explore Blazor cookie authentication, a crucial aspect of Blazor authentication methods. Blazor cookie authentication offers a seamless way to authenticate users within your Blazor web app without the need for identity. With the release of Blazor authentication .NET 8, cookie authentication has become even more accessible and powerful. In our example of Blazor authentication without identity, we'll demonstrate how to implement cookie authentication effectively. By utilizing Blazor server cookie authentication, you can ensure secure and reliable authentication for your users. We'll cover Blazor server-side cookie authentication in detail, showcasing its integration within Blazor server applications.
Blazor Server Custom Authentication State [Blazor Server Auth State Provider]:
In this Blazor authentication example (blazor login user), we'll delve into Blazor custom authentication, a powerful method for authenticating users within your Blazor web app. Through our Blazor web app sample, we'll demonstrate how to implement custom authentication effectively.
🌟 Get Source Code: www.patreon.com/CodingDroplets
🔗Blazor Tutorial Series: czcams.com/play/PLzewa6pjbr3IQEUfNiK2SROQC1NuKl6PV.html
hello team, i´m having an issue on my project because i´m using radzen components and HTTPContext doesn´t work with InteractiveServer as rendermode... any idea with it? thanks.
Excellent tutorial, from one content creator to another. I just got this working exactly as you did. For anyone else trying to follow, I highly recommend you gain and understanding of render modes before doing this tutorial. Important things to note: the project must be setup as (DotNet 8) with Server (Interactive Render Mode) and Per Page/Component (Interactivity Location). If not, this will not work. I also watched your previous video 'DotNet Core Web API - ASP Net Core Web API CRUD with Entity Framework Core' which helped massively. I did also have to look up other videos on how to setup a local SQL server (it's easy). Be aware that the connection string is a little different for a local database. Thank you!
Thank you for the detailed feedback and for sharing your experience! Your insights will definitely help others following along. Glad to hear that you found the tutorials helpful.
This is it my dude. Everyone is showcasing the particular de facto method proposed by Microsoft, you're getting into the good and actually useful stuff.
Thank you so much! I'm glad you found the tutorial useful. It's always great to hear that the content is making a difference.
This video is a gem. Lot of people are looking for this in stack overflow and reddit. The video title made me think this is one of the efcore identity video and I was about to skip. luckily didn't skip and this helped me a lot to understand the auth stuff. Maybe you can add "Custom" or "without efcore identity" in the title so it will be clear and listed out for the people who is searching for this. Thanks for the wonderful tutorial!
Thank you for your feedback and suggestion! I'm glad the video was helpful to you.
The most powerful yet concise intro to Authentication & Authorization. Very useful. Thanks
Thank you so much for the kind words! I'm glad you found the introduction to Authentication & Authorization useful.
Your tutorial of Blazor are the best! Short, concise and pretty straightforward! Keep making those!
Thank you so much for your kind words! I'm glad you find the tutorials helpful.
Quick and easy to follow, thank you..
Thank You for your feedback. Glad to hear that.
Simple, fast and directly to subject.
Thank you!
You're welcome!
Thank you!
It is straightforward, fast, and focused on the main thing.
Thank you so much for your feedback! Glad to hear that.
Thank you so much for this! Exactly what i needed to understand how to implement auth!
You're very welcome! Glad to hear that.
Excellent tutorial. You sir have showed me some things I have not seen in other videos yet. Thank you!
You are Welcome! Glad to hear that.
quality content, thanks!
Thank you for your feedback! I'm glad you enjoyed the content.
This is amazing my friend. Thank you so much.
You're very welcome
thanks very much. excelente video information! Congratulations!
You are Welcome! Glad to hear that.
Thank you, but why not using Microsoft identity?
Thank you for your question! In this particular video, we focused on implementing a custom authentication solution to provide a deeper understanding of the authentication process in Blazor. However, using Microsoft Identity for authentication is indeed a common and robust approach, and we'll definitely cover it in an upcoming video.
We have our own database and user verification, spread around multiple applications (and not only Microsoft)
If we implemented Identity, we would have needed 2 user databases and a Skript to synchronize them. (Maybe there is a better solution, but this video is definitely the preferred way for now)
Also, every Microsoft documentation ever about authentication talks about Identity already... Except one I found, but it's MVC exclusive
Much Needed Video👏
Thank you for your feedback! I'm glad to hear that you found the video helpful. Your feedback is valuable and helps me create content that meets the needs of viewers like you. 😊🚀
On this i have error Exception of type 'Microsoft.AspNetCore.Components.NavigationException' was thrown, and can not navigate to other page after login. And how to fix that issue?
To help you better, could you please provide more details about the error? You can check the console for more details on the exception. Additional information will be helpful in diagnosing the problem.
Awesome tutorial, thanks
Thank you! I'm glad you enjoyed the tutorial
Hi thanks for this vidéo !
i have this error when login :
InvalidOperationException: EditForm requires either a Model parameter, or an EditContext parameter, please provide one of these.
thanks so lot
It seems like you've not assigned the model for the EditForm
All the text and pictures bobbing and jiggling around is distracting
Thank you for your feedback! I apologize for any distraction caused by the text and pictures in the tutorial. I'll make sure to take your comment into consideration for future videos to ensure a smoother viewing experience.
@@CodingDroplets no problem, nice video
@CodingDroplets, hello team, i´m having an issue on my project because i´m using radzen components and HTTPContext doesn´t work with InteractiveServer as rendermode... any idea with it? thanks.
When using the InteractiveServer render mode, Blazor communicates with the server using SignalR, causing the HttpContext object to be null. To receive the HttpContext, we utilize a standard form post method.
@@CodingDroplets Thanks a lot for your response. I´ll do it.
@@CodingDroplets I have the same issue. What do mean standard form post method?
@Arm0geddon .. Make sure the login page is not using InteractiveServer render mode.
HttpContext aways null (using InteractiveServer render mode), any tips?
This tutorial is obsolete. the blazer app provides an template
@@futasccsloli you mean, if i create a new project as blazor web app with individual authentication enabled?
Thanks for reaching out! In this tutorial, I used the Blazor Web App project template (DotNet 8) with Server (Interactive Render Mode) and Per Page/Component (Interactivity Location). Are you using Global (Interactivity Location)?
@@CodingDroplets i'm using the same setup as you, but when I set @rendermode InteractiveServer on Login page the HttpContext is aways null, it only works if I don't set rendermode
@@DiegoVieira Yes.But it uses efcore, and if you use another orm, you have to replace it.
Awesome tutorial @CodingDroplets, but I have issue with the HttpContext in the Login.razor Line 62, it is null at runtime. Is there something that I am missing?
You might be using rendermode in Login page
how to solve the empty HttpContext in the login
Thank you,
Will this code work for blazor web assembly ?
Very useful.
Thank you very much.
You're welcome! I'm glad you found the tutorial useful.
You Got a Eternal Subscriber😁
Wow! Thank you so much for your support and for being an eternal subscriber! I'm glad to have you as part of the community.
Excellent video, I have tried to implement the LOGIN component with the FluentUI library and it throws some errors, could someone help me, thank you !!
Thank you! I haven't tried implementing the LOGIN component with FluentUI myself. Could you please share the specific errors you're encountering? That way, I or someone else in the community might be able to assist you better.
@@CodingDroplets in the LOGIN component the error in this statement "HttpContext.User.Identity.IsAuthenticated" indicates that HttpContext is null
The login page might be using InteractiveServer render mode. You should not specify any render modes for login page.
Excellent
Thank you!
when you press F5 you will be logged out, won't you? I'm struggeling implementing a persisent way in Server Blazor ...
You won't get logged out when you press F5 as long as the authentication cookie is valid. The persistence of the authentication state depends on the lifetime of the authentication cookie. If you're facing issues with maintaining the login state, ensure that your authentication cookie settings are correct.
Thanks
Thank You So Much for the Support!
This is awesome tutorial, this is cool. You got a new subscriber!
Thank you so much for the kind words and for subscribing! I'm glad you found the tutorial helpful.
In my program.cs, it says that AddCascadingAuthenticationState is not defined in IServiceCollection
I have the same issue
Thank you for your comment! The tutorial you're referring to is specifically for .NET 8 Blazor Web App. If you're using a lower version, it's possible that the method might not be available in your version.
For viewers using a lower version, I recommend checking out the tutorial at czcams.com/video/iq2btD9WufI/video.html
Thanks!
Thank You so much for the support!
The only problem with this app template is that no dialog can be display if there is any error due to the component has no interaction
Great Tutorial!
I am getting 'Object Reference not set to an instance of an object on code 'await HttpContext.SignInAsync(principal);' in Login.razor
is there any I have missed
Are you using any render modes in the login page?
Thx for the help. It worked the first time but the second time a get a message with the problem: disable antiforgerytoken
How can i fix this issue?
what project template are you using, and how is it setup. I don't get the same initial code as your video when i select a Blazor web app
The project template used in the tutorial is "Blazor Web App (dotnet 8)" with the "per page/component interactive server" render mode.
why the HttpContext is coming null at login page
i figured it bc it was at rendermode interactiveserver httpcontext is always null 😀
@@kastriotgjoka7226 had the same issue, thanks for letting us know
Thank you both for sharing your experiences! It's great to hear that you were able to identify the issue.
If I don't have rendermode, the information I enter won't be saved. If I add rendermode then I can't login because HttpContext is null. What should I do?
You can avoid using render-mode only on the login page, ensuring that HttpContext is available during login. For other pages where you are saving data, you can use the render-mode.
@@CodingDroplets The problem is, without rendermode information like username and password will not be saved and sent. The program will say that the information is empty and needs to be entered when I run it
I have found the problem. When the code I forgot about [SupplyParameterFromForm], after adding it the program runs fine even without rendermode
Great to hear you found the solution! Adding [SupplyParameterFromForm] is indeed essential. Thanks for sharing your fix. This will be helpful for others facing the same issue. Happy coding!
I ❤ it !!! Ty
Thank you for your positive feedback! Glad to hear that.
Hello there, could you make a video on Authentication & Authorization on .Net Blazor Web App (both Server & Client in a single solution) using .Net 8?
Thank you for the suggestion! I'll definitely consider creating a video on Authentication & Authorization for a .NET Blazor Web App, covering both Server-side and Client-side implementations in a single solution using .NET 8. Stay tuned for upcoming videos.
@@CodingDroplets would love to see that!
thanks you
You are most welcome!
How to resolve HttContext always null? :(
Are you using any render-modes in login component?
@@CodingDroplets My project uses global Server Render.
@@CodingDroplets same problem here, I'm trying with InteractiveServer render mode
@@CodingDroplets Hi, I am also facing the same problem. But I am not explicitly using any rendermodes in the login component. Please help! :(
I removed "@rendermode InteractiveServer" it and it solved it for me!
Excellent video, very easy to understand - Will this same Authentication/Authorization logic work in a Blazor WASM app as well or is it very different? Thx
Thank you for your feedback! I'm glad you found the video easy to understand. The Authentication/Authorization logic can indeed work in a Blazor WebAssembly (WASM) app as well, but there are a few differences and considerations to keep in mind due to the client-side nature of WASM.
I'll be covering the specifics of Authentication and Authorization in Blazor WASM in a separate video.
Looking forward to that video where you show how to handle both Server and WASM together. Thx again@@CodingDroplets
Can you make a video about interceptors? A class where all the request are going through and set token as a header for every request. Can i store acces_token in claims to use for my request?
Great video!
Thank you for the suggestion! Creating a video on interceptors and token management sounds like a great idea. I'll keep your request in mind for future videos.
@@CodingDroplets Can't wait to see you solution, since you can't call AuthenticationState in service, only in Razor components.
Can you please show where the user can register first then login with the registered information.
Thank you for your suggestion! I'll definitely consider including a demonstration of user registration followed by login with the registered information in an upcoming video.
If you refresh the page after successfully authenticating it forces you to login again?
No it won't. It will force to login again only after cookie expiry.
same problem right here, F5 is logging me out somehow
great video. but how does built-in authentication system know about iuser_accoint table in sql.
2:50 - Whoa, hold up a sec; so this method stores passwords *in plain text* in the backend? That is *not* secure. I would be very worried if I found out a site I had an account with was storing my password unencrypted like this.
If you're using your own login system, always, *always,* store a salted hash of the password, not the password itself, and have your login system check the hash of the supplied password against the one in the system. That's been a fundemental aspect of system security for as long as I remember.
Thank you for your comment! This video is primarily focused on explaining Blazor Authentication rather than implementing a fully secure authentication system. However, you're absolutely right about the importance of storing passwords securely. In a production environment, it's crucial to use techniques like salting and hashing to protect user passwords. This video aimed to demonstrate the authentication process within a Blazor application, but I appreciate you highlighting the importance of password security.
Hello there, could you make a video on Authentication & Authorization on .Net Blazor Web App (both Server & Client in a single solution) using .Net 8?
Thank you for the suggestion! I'll definitely consider creating a video on Authentication & Authorization for a .NET Blazor Web App, covering both Server-side and Client-side implementations in a single solution using .NET 8. Stay tuned for upcoming videos.
@@CodingDroplets Thanks! Looking forward to this. It is much needed and I haven't seen anybody cover this from basic. Would be really helpful to a lot of people including myself who wish to incorporate custom Authentication in Blazor web app with Auto render mode.
Hi ,really liked this video. You have covered it very well.
Could you please consider making a small video about micro front end with Blazor and .net core Microservices