Blazor Authentication Tutorial - How to Authorize in Blazor [Blazor Tutorial]

Sdílet
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.

Komentáře • 160

  • @CodingDroplets
    @CodingDroplets  Před 6 měsíci

    🌟 Get Source Code: www.patreon.com/CodingDroplets
    🔗Blazor Tutorial Series: czcams.com/play/PLzewa6pjbr3IQEUfNiK2SROQC1NuKl6PV.html

    • @albertoramirez9031
      @albertoramirez9031 Před 3 měsíci

      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.

  • @thehardwareguy
    @thehardwareguy Před 5 dny +2

    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!

    • @CodingDroplets
      @CodingDroplets  Před 4 dny

      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.

  • @navirbox4913
    @navirbox4913 Před měsícem +2

    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.

    • @CodingDroplets
      @CodingDroplets  Před měsícem

      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.

  • @elangovan4ever
    @elangovan4ever Před 5 měsíci +4

    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!

    • @CodingDroplets
      @CodingDroplets  Před 3 měsíci

      Thank you for your feedback and suggestion! I'm glad the video was helpful to you.

  • @parashgoswami264
    @parashgoswami264 Před 2 měsíci +2

    The most powerful yet concise intro to Authentication & Authorization. Very useful. Thanks

    • @CodingDroplets
      @CodingDroplets  Před 2 měsíci

      Thank you so much for the kind words! I'm glad you found the introduction to Authentication & Authorization useful.

  • @aisyahh38
    @aisyahh38 Před měsícem +1

    Your tutorial of Blazor are the best! Short, concise and pretty straightforward! Keep making those!

    • @CodingDroplets
      @CodingDroplets  Před měsícem

      Thank you so much for your kind words! I'm glad you find the tutorials helpful.

  • @anthonyquijano7697
    @anthonyquijano7697 Před 22 dny +2

    Quick and easy to follow, thank you..

  • @gladqueiroz01
    @gladqueiroz01 Před 4 měsíci +3

    Simple, fast and directly to subject.
    Thank you!

  • @mizanurrahaman1056
    @mizanurrahaman1056 Před 2 měsíci +1

    Thank you!
    It is straightforward, fast, and focused on the main thing.

    • @CodingDroplets
      @CodingDroplets  Před 2 měsíci

      Thank you so much for your feedback! Glad to hear that.

  • @TobiasLarsen93
    @TobiasLarsen93 Před 3 měsíci +1

    Thank you so much for this! Exactly what i needed to understand how to implement auth!

  • @user-vi7xn1tj9f
    @user-vi7xn1tj9f Před 3 měsíci

    Excellent tutorial. You sir have showed me some things I have not seen in other videos yet. Thank you!

  • @MEIYANG-sj2sb
    @MEIYANG-sj2sb Před 17 dny +1

    quality content, thanks!

    • @CodingDroplets
      @CodingDroplets  Před 17 dny

      Thank you for your feedback! I'm glad you enjoyed the content.

  • @DannysGalaxyTab
    @DannysGalaxyTab Před 26 dny +1

    This is amazing my friend. Thank you so much.

  • @softw.netcore7521
    @softw.netcore7521 Před 3 měsíci +2

    thanks very much. excelente video information! Congratulations!

  • @mightypirate100
    @mightypirate100 Před 6 měsíci +5

    Thank you, but why not using Microsoft identity?

    • @CodingDroplets
      @CodingDroplets  Před 6 měsíci +2

      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.

    • @WolligesSchaf
      @WolligesSchaf Před 6 měsíci +1

      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

  • @imashar
    @imashar Před 6 měsíci +2

    Much Needed Video👏

    • @CodingDroplets
      @CodingDroplets  Před 6 měsíci

      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. 😊🚀

  • @nkkounmany3902
    @nkkounmany3902 Před 20 dny +1

    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?

    • @CodingDroplets
      @CodingDroplets  Před 20 dny

      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.

  • @RockoShaw
    @RockoShaw Před 2 měsíci +1

    Awesome tutorial, thanks

  • @pilou15cantal69
    @pilou15cantal69 Před 7 dny +1

    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

    • @CodingDroplets
      @CodingDroplets  Před 7 dny

      It seems like you've not assigned the model for the EditForm

  • @kipchickensout
    @kipchickensout Před 4 měsíci +6

    All the text and pictures bobbing and jiggling around is distracting

    • @CodingDroplets
      @CodingDroplets  Před 4 měsíci +1

      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.

    • @kipchickensout
      @kipchickensout Před 4 měsíci +2

      @@CodingDroplets no problem, nice video

  • @albertoramirez9031
    @albertoramirez9031 Před 3 měsíci +4

    @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.

    • @CodingDroplets
      @CodingDroplets  Před 3 měsíci +3

      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.

    • @albertoramirez9031
      @albertoramirez9031 Před 3 měsíci

      @@CodingDroplets Thanks a lot for your response. I´ll do it.

    • @Arm0geddon
      @Arm0geddon Před 3 měsíci +1

      @@CodingDroplets I have the same issue. What do mean standard form post method?

    • @CodingDroplets
      @CodingDroplets  Před 2 měsíci

      @Arm0geddon .. Make sure the login page is not using InteractiveServer render mode.

  • @DiegoVieira
    @DiegoVieira Před 4 měsíci +3

    HttpContext aways null (using InteractiveServer render mode), any tips?

    • @futasccsloli
      @futasccsloli Před 4 měsíci

      This tutorial is obsolete. the blazer app provides an template

    • @DiegoVieira
      @DiegoVieira Před 4 měsíci

      @@futasccsloli you mean, if i create a new project as blazor web app with individual authentication enabled?

    • @CodingDroplets
      @CodingDroplets  Před 4 měsíci

      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)?

    • @DiegoVieira
      @DiegoVieira Před 4 měsíci +1

      @@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

    • @futasccsloli
      @futasccsloli Před 4 měsíci

      @@DiegoVieira Yes.But it uses efcore, and if you use another orm, you have to replace it.

  • @socketafricaremotedesktop
    @socketafricaremotedesktop Před 3 měsíci +2

    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?

  • @isaacnavarro4716
    @isaacnavarro4716 Před 4 měsíci +2

    how to solve the empty HttpContext in the login

  • @myrogitesir7075
    @myrogitesir7075 Před 5 měsíci +2

    Thank you,
    Will this code work for blazor web assembly ?

  • @talkathiriify
    @talkathiriify Před 6 měsíci +1

    Very useful.
    Thank you very much.

    • @CodingDroplets
      @CodingDroplets  Před 6 měsíci

      You're welcome! I'm glad you found the tutorial useful.

  • @leriosindane720
    @leriosindane720 Před 6 měsíci +1

    You Got a Eternal Subscriber😁

    • @CodingDroplets
      @CodingDroplets  Před 6 měsíci

      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.

  • @JulianBedoyaVargas
    @JulianBedoyaVargas Před 2 měsíci +2

    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 !!

    • @CodingDroplets
      @CodingDroplets  Před 2 měsíci

      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.

    • @JulianBedoyaVargas
      @JulianBedoyaVargas Před 2 měsíci +1

      @@CodingDroplets in the LOGIN component the error in this statement "HttpContext.User.Identity.IsAuthenticated" indicates that HttpContext is null

    • @CodingDroplets
      @CodingDroplets  Před 2 měsíci

      The login page might be using InteractiveServer render mode. You should not specify any render modes for login page.

  • @yaredalmaw6644
    @yaredalmaw6644 Před 3 měsíci +1

    Excellent

  • @socomjoy4563
    @socomjoy4563 Před měsícem +1

    when you press F5 you will be logged out, won't you? I'm struggeling implementing a persisent way in Server Blazor ...

    • @CodingDroplets
      @CodingDroplets  Před měsícem

      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.

  • @StephenBargewell
    @StephenBargewell Před 3 měsíci +1

    Thanks

  • @RajK09
    @RajK09 Před 6 měsíci

    This is awesome tutorial, this is cool. You got a new subscriber!

    • @CodingDroplets
      @CodingDroplets  Před 6 měsíci +1

      Thank you so much for the kind words and for subscribing! I'm glad you found the tutorial helpful.

  • @michaelreiricamata2347
    @michaelreiricamata2347 Před 4 měsíci +2

    In my program.cs, it says that AddCascadingAuthenticationState is not defined in IServiceCollection

    • @Lavaman-fn2ip
      @Lavaman-fn2ip Před 4 měsíci +2

      I have the same issue

    • @CodingDroplets
      @CodingDroplets  Před 4 měsíci

      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

  • @GiantsOnTheHorizon
    @GiantsOnTheHorizon Před 4 měsíci +1

    Thanks!

  • @wellington18m
    @wellington18m Před 5 měsíci

    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

  • @saroasahamed
    @saroasahamed Před 6 měsíci +3

    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

    • @CodingDroplets
      @CodingDroplets  Před 6 měsíci

      Are you using any render modes in the login page?

  • @LebaneseEntertainment
    @LebaneseEntertainment Před 3 měsíci

    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?

  • @klondikexx2831
    @klondikexx2831 Před 6 měsíci +2

    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

    • @CodingDroplets
      @CodingDroplets  Před 6 měsíci +2

      The project template used in the tutorial is "Blazor Web App (dotnet 8)" with the "per page/component interactive server" render mode.

  • @kastriotgjoka7226
    @kastriotgjoka7226 Před 6 měsíci +3

    why the HttpContext is coming null at login page

    • @kastriotgjoka7226
      @kastriotgjoka7226 Před 6 měsíci +5

      i figured it bc it was at rendermode interactiveserver httpcontext is always null 😀

    • @gilbert3546
      @gilbert3546 Před 6 měsíci +1

      @@kastriotgjoka7226 had the same issue, thanks for letting us know

    • @CodingDroplets
      @CodingDroplets  Před 6 měsíci

      Thank you both for sharing your experiences! It's great to hear that you were able to identify the issue.

  • @Perfeitor
    @Perfeitor Před měsícem +1

    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?

    • @CodingDroplets
      @CodingDroplets  Před měsícem

      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.

    • @Perfeitor
      @Perfeitor Před měsícem

      @@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

    • @Perfeitor
      @Perfeitor Před měsícem +1

      I have found the problem. When the code I forgot about [SupplyParameterFromForm], after adding it the program runs fine even without rendermode

    • @CodingDroplets
      @CodingDroplets  Před měsícem

      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!

  • @stephanegenet1523
    @stephanegenet1523 Před 4 měsíci +1

    I ❤ it !!! Ty

    • @CodingDroplets
      @CodingDroplets  Před 4 měsíci

      Thank you for your positive feedback! Glad to hear that.

  • @RajK09
    @RajK09 Před 6 měsíci +1

    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?

    • @CodingDroplets
      @CodingDroplets  Před 6 měsíci +2

      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.

    • @socomjoy4563
      @socomjoy4563 Před měsícem

      @@CodingDroplets would love to see that!

  • @user-lx2if3kq8u
    @user-lx2if3kq8u Před 6 měsíci +1

    thanks you

  • @danilovalim9400
    @danilovalim9400 Před 4 měsíci +2

    How to resolve HttContext always null? :(

    • @CodingDroplets
      @CodingDroplets  Před 4 měsíci

      Are you using any render-modes in login component?

    • @danilovalim9400
      @danilovalim9400 Před 4 měsíci

      @@CodingDroplets My project uses global Server Render.

    • @DiegoVieira
      @DiegoVieira Před 4 měsíci

      @@CodingDroplets same problem here, I'm trying with InteractiveServer render mode

    • @prakriti_gupta
      @prakriti_gupta Před 4 měsíci

      @@CodingDroplets Hi, I am also facing the same problem. But I am not explicitly using any rendermodes in the login component. Please help! :(

    • @danielpelissari7539
      @danielpelissari7539 Před 3 měsíci

      I removed "@rendermode InteractiveServer" it and it solved it for me!

  • @saroshwadia
    @saroshwadia Před 6 měsíci +1

    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

    • @CodingDroplets
      @CodingDroplets  Před 6 měsíci +1

      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.

    • @saroshwadia
      @saroshwadia Před 6 měsíci

      Looking forward to that video where you show how to handle both Server and WASM together. Thx again@@CodingDroplets

  • @gilbert3546
    @gilbert3546 Před 6 měsíci +1

    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!

    • @CodingDroplets
      @CodingDroplets  Před 6 měsíci +1

      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.

    • @gilbert3546
      @gilbert3546 Před 6 měsíci

      @@CodingDroplets Can't wait to see you solution, since you can't call AuthenticationState in service, only in Razor components.

  • @muhlurihlungwani508
    @muhlurihlungwani508 Před 5 měsíci

    Can you please show where the user can register first then login with the registered information.

    • @CodingDroplets
      @CodingDroplets  Před 5 měsíci +1

      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.

  • @AP-pz9wp
    @AP-pz9wp Před 5 měsíci +1

    If you refresh the page after successfully authenticating it forces you to login again?

    • @CodingDroplets
      @CodingDroplets  Před 5 měsíci

      No it won't. It will force to login again only after cookie expiry.

    • @socomjoy4563
      @socomjoy4563 Před měsícem

      same problem right here, F5 is logging me out somehow

  • @yassermian9913
    @yassermian9913 Před 3 měsíci

    great video. but how does built-in authentication system know about iuser_accoint table in sql.

  • @AdrianWoodUK
    @AdrianWoodUK Před 3 měsíci +1

    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.

    • @CodingDroplets
      @CodingDroplets  Před 3 měsíci

      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.

  • @RajK09
    @RajK09 Před 6 měsíci

    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?

    • @CodingDroplets
      @CodingDroplets  Před 6 měsíci

      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.

    • @nishanthrajkumar8333
      @nishanthrajkumar8333 Před 4 měsíci

      @@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.

    • @yogeshgodse7372
      @yogeshgodse7372 Před 4 měsíci

      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