This is the only, the most complete, simple and clarified tutorial on the whole TH-cam about Blazor WebAssembly Authorization & Authentication. Thank you.
Thank you for taking the time to watch the video, and for leaving your feedback! I'm glad that the video was helpful to you and that you found it to be the most complete, simple, and clarified tutorial on the topic available on TH-cam.
Here is professionalism: - Explain complex things in simple terms - High quality video - High sound quality If it's possible, please create you official web site for your tutorials, It's will be better then a lot of world university programs Respect!!!!
Brilliant Work! This covers a lot of the areas required for custom Authentication in Blazor. Very well put together, and very well presented. Thanks guys.
Thankyou for this tutorial. This is the first one I've found that explains how to succinctly add Authentication to a Blazor app without having to use the built in stuff and allowing us to implement our own authentication scheme. This is essential to me as I am trying to create a Blazor front end to an existing legacy system that has its own authentication system that can't be changed.
Thank you so much for taking the time to watch and comment on my video! I really appreciate your kind words and am thrilled to hear that you noticed an improvement in the quality and professionalism of this video compared to earlier ones in the series. I've been working hard to refine my skills and techniques to make each video better than the last, and your feedback is a great encouragement to keep going. Thanks again for your support and I hope you continue to enjoy my content!
💥Host Your Blazor App in Linux: th-cam.com/video/bXK-F-uL7Qo/w-d-xo.html 🔗Blazor Tutorial Series Playlist link: th-cam.com/play/PLzewa6pjbr3IQEUfNiK2SROQC1NuKl6PV.html
One thing about the custom authentication state provider class you created. There is no need to await a Task.FromResult. You are already in an async method, so just return the object. No need to create a new Task in the method and await it. That just creates a useless thread switching context that is not needed. Also, Base64 Encoding is not "encrypting". For anyone watching this video, if you are relying on Base64 encoding something to be "encrypting it" you are not secure by a long shot.
I have been following your entire Blazor tutorial playlist. All the videos have been very helpful. However the final two, the Auth tutorials, were very fast, and you spent most of the time pasting in code rather than typing out and explaining it. I have completed the auth tutorials, but I am left still with questions about exactly 'what' I wrote, and how/why it works. I would prefer it if these auth videos were longer, and you took the time to explain what each step of the auth flow was actually doing.
Thank you for taking the time to leave a comment and for following my Blazor tutorial playlist! I appreciate your feedback on the Authentication and Authorization videos, and I apologize for any confusion or frustration caused by the pacing and level of detail in those tutorials. I understand that the Authentication and Authorization topics can be complex, and it's important to have a clear understanding of the code and flow involved. I will take your feedback into consideration for future tutorials and aim to provide more thorough explanations and details on each step. If you have any specific questions or concerns about the code in those videos or other related topics, please feel free to let me know in the comments section. I'm always happy to help clarify and provide additional resources where possible. Thanks again for your support and for watching!
Really great stuff !! I was looking for that for more than 1 year now ! This approach really gives you much more flexibility than Windows Identity. Maybe just one little thing. In the LoginRequest the password is sent in clear text to the Web Api !
Thank You for sharing your thoughts! Glad to know you liked. As you mentioned in the comment, we can encrypt the password in the request. Will include that in an upcoming video.
This is awesome, easy to understand and follow along. However in which part of the video, did you set the value for the "ExpiryTimeStamp"? In GetToken method there's is validation where you compare the DateTime.Now to ExpiryTimeStamp. Thank you
Thank you for your positive feedback. Glad that you're enjoying our channel and finding the content valuable. We'll be including more videos in the series soon.
Thanks for the explanation, it was nice. However, the token contains name, surname and role information. It is generally not preferred to get it with a different parameter 👏
Thank you great video! Could you give me some advice on how to implement reading custom user information? E.g. avatar url, nickname or its description? It's not clear to me where I should call this readout and where to store this information in the front-end. Thank you
You can add multiple claims or you can add the Unique ID of the logged in user in claims. Then fetch the remaining details like Avatar URL, Nickname etc from DB. If you've added UserAccountId in claims, you can fetch it as below. var authState = await AuthenticationState; var userAccountId = authState.User.Claims.GetClaimsValueByType("UserAccountId");
Forgot to mention the extension method named GetClaimsValueByType. This method will fetch the value from claims. Below is the method. public static string? GetClaimsValueByType(this IEnumerable claims, string claimType) { string? result = null; if (claims != null && claims.Count() != 0) { var claim = claims.Where(x => x.Type == claimType).FirstOrDefault(); if (claim != null) result = claim.Value; } return result; }
Good tutorial, congratulations, for me as a neophyte it was very useful. I was wondering, based on your example as-is, if the attributes [AllowAnonymous], [Authorize(Roles = "Administrator")], etc. they can also be applied in server-side CRUD controllers. I tried it but it doesn't seem to work, what can you recommend?
Thank You! Glad to know you find it useful. In the demo application we've already implemented the attributes in server side. You can find the source code in the below URL. Please verify your code. github.com/codingdroplets/BlazorWasmAuthenticationAndAuthorization
@@CodingDroplets Yes, I noticed this in your example, however if I apply it to my controllers working together with Interfaces and ServicesManagers in REST mode, these attributes (except [Anonymous]) are blocking.
Have your provided the authorization header in the API request (as shown below)? Http.DefaultRequestHeaders.Authorization = new AuthenticationHeaderValue("bearer", token);
@@CodingDropletsFANTASTIC!!! Although I wrote the step-by-step code while following the video, I didn't notice that I left out this line of code. Now everything works fine! I really don't know how to thank you, you were very kind.
Hello, your video is interesting, I made the mistake of using the individual accounts option in my project, and the identity server was installed which is impossible to deploy on a web server. There is no information on how to do it and it is frustrating since neither Microsoft nor Duende Software tells you how to configure it. Now, my question is there is a way to use this identity server in production ?
Thank you for watching the video and for sharing your concern about deploying the identity server in a production environment. Using an identity server in production is indeed possible and widely done. While the specific deployment process may vary depending on your hosting environment and requirements, I can provide you with some general steps to guide you: Prepare your environment: Ensure that you have a suitable hosting environment for your identity server. This could be a virtual private server (VPS), a cloud-based infrastructure, or a dedicated server. Configure the identity server: Set up your identity server by following the installation and configuration instructions provided by the identity server framework you are using. Microsoft's Identity Server and Duende IdentityServer are two popular options. Secure the identity server: Implement appropriate security measures for your identity server, such as using HTTPS for secure communication, securing sensitive configuration data, and applying necessary authentication and authorization mechanisms. Configure client applications: Update your client applications, such as your Blazor WebAssembly application, to use the deployed identity server for authentication and authorization. This involves configuring the client applications to use the correct client settings, including the client ID, client secrets, and redirect URIs. Test and troubleshoot: Thoroughly test your deployment to ensure that the identity server is functioning as expected. Pay attention to error handling, logging, and any specific requirements of your hosting environment. Regarding specific instructions for deploying the identity server in your chosen hosting environment, it is best to consult the official documentation provided by Microsoft or Duende Software. They usually provide detailed guides and documentation on deployment scenarios, including considerations for different hosting options. I understand that the lack of readily available information can be frustrating, but with careful research and possibly seeking support from the framework's official channels or community forums, you should be able to find the necessary guidance for deploying your identity server in production. Remember to always follow security best practices, keep your software and dependencies up to date, and regularly monitor and maintain your deployed identity server.
@@CodingDroplets Hi, thanks for your reply, but after having tried to deploy my project without success. I did a simple test, I created a Blazor Wasm project, using individual account authentication, just use the default template, then i added the duende license. I verified that it works on my pc without problems or errors and finally I deployed it on the server. Couldn't get it to work because of a bunch of bugs that weren't supposed to happen.
I'm sorry to hear that you encountered difficulties when trying to deploy your project with individual account authentication and the Duende license. Deployment issues can indeed be frustrating, especially when unexpected bugs arise. While it's difficult to pinpoint the exact cause of the bugs without more information, I can offer some suggestions to help troubleshoot and resolve the deployment problems: Double-check the deployment environment: Ensure that the server meets the necessary requirements for hosting your Blazor WebAssembly application. Check the version of .NET runtime, operating system compatibility, and any other dependencies or configurations specific to your application. Review the error messages: Analyze the error messages or log files generated during the deployment process to gain insights into the nature of the bugs. Error messages can provide valuable clues about what went wrong and help narrow down the possible causes. Update dependencies: Make sure that all the dependencies, including the Duende license, are up to date and compatible with your deployment environment. Check for any known issues or updates related to the specific versions you are using. Test with a minimal project: Consider creating a minimal, stripped-down version of your project that focuses solely on the authentication and deployment aspects. This can help isolate and identify any specific code or configuration issues that might be causing the bugs. Seek support: Reach out to the official support channels of the Duende Software community or Microsoft's Blazor community. They can provide guidance, offer insights based on similar experiences, and help troubleshoot the specific problems you're facing. Remember that deploying an application involves various factors, including the hosting environment, configuration settings, dependencies, and code itself. Sometimes, unexpected issues can arise, and it may require careful investigation and collaboration with the community or official support channels to identify and resolve them.
@@CodingDroplets Yes, deploying involves lots of things, for example the key, appsetings for production, how to store the key (file or store) the certificate pfx and much more. As i said to you, its almost impossible to do it. And i can see no body can't do it, because there is not any video with that topics. I asked myself why not microsoft advice the great problems will we have adding this option of individual accounts. Maybe, we can develop a more simple authentication provider, but simpler to develop. Thanks, and i hope you be the first one to prepare a video with a real scenario that is to develop a blazor Wasm in a IIS server.
@@CodingDroplets i forgot to answer you that Duende web page shows examples that have different classes that Visual Studio added to the project, its very difficult to try to understand what you have do.
So, I'm getting an issue where the client doesn't respond to the API's token. No session set for example. Swagger though, shows that the token is generated as the returned Dto has the correct, populated fields from the Login controller. Any ideas? I'm at a loss. I went through the video twice to see what I missed, I can't find it.
Source code is available in the below github repository. github.com/codingdroplets/BlazorWasmAuthenticationAndAuthorization Please compare with your code. Especially the program.cs class and CustomAuthenticationStateProvider class.
Thank you for the video. But I have one question.When I click on the menu or home logo without logging in, this message appears. -> RolesAuthorizationRequirement:User.IsInRole must be true for one of the following roles: (Administrator|User) -> I haven't been able to find a solution for over a week.
Thank you for watching the video, and I appreciate your question. The message you're encountering indicates that there is a role-based authorization check that is not passing when accessing certain resources without being logged in. To further diagnose the issue, compare your source code with the code in the GitHub repository: github.com/codingdroplets/BlazorWasmAuthenticationAndAuthorization
@@CodingDroplets I downloaded and ran your code, but I keep getting the same problem. -> Press F12 and click on the Console tab. -> If you click the home button or menu button without logging in -> you will get this message: RolesAuthorizationRequirement:User.IsInRole must be true for one of the following roles:(Administrator|User)
Thank you for your comment, Arash! I'm glad you found the video helpful. If you have any questions or suggestions for future content, please don't hesitate to let me know. Thanks again for watching!
Thank you for the video. Very nice job. I just have one question. I'm using .Net7. I've downloaded your source code and compared my files to yours. It all seems to be the same. The problem is that when I click the Log In button nothing happens if the credentials are correct. If they are wrong, I get the Alert message. So, I ran your source code directly and I have the same problem. I try to Log In but when I click the button nothing happens with the correct credentials. If the credentials are wrong, I get a loginResponse StatusCode of Unauthorized. This is correct. But if the credentials are correct, I get a loginResponse StatusCode of Internal Server error. Is this a .net7 issue? If not, how do I fix this?
Thank you for your feedback and for trying the project from the GitHub repository. I'm glad you found the video helpful! I've tested the project from the repository and it's working as expected, which suggests that the issue might not be related to the project code itself. When you're facing problems like this where the code appears to be correct, but something is not working as expected, it's a good practice to check the browser's developer console for any erros.
@@CodingDroplets Thank you for your response. I tried tracking down the issue and this is what I found. I get and exception thrown in the "private Task InvokeNextActionFilterAsync()" method in ControllerActionInvoker.cs file. The error says: 10/20/2023 7:38:48 AM' must be after NotBefore: '10/20/2023 11:18:51 AM. 7:38:48 AM is the local time here now on the east coast of the U.S. 11:18:51 is UTC 20 minutes ago. Could this be a problem with this code not working depending on your time zone?
You're welcome! To prevent multiple instances of the same user from logging in simultaneously, you can implement session management in your Blazor WebAssembly application. You can achieve this by using a server-side mechanism to track active sessions for each user. When a user logs in, you can mark their session as active. If the same user tries to log in from another browser or device, you can check whether they already have an active session. If so, you can choose to prevent the new login or terminate the existing session, depending on your application's requirements. It's important to note that implementing this kind of session management may require some server-side logic, and you'll need to consider how to handle session expiration and user actions, such as logout. The exact implementation will depend on your application's architecture and security requirements.
I got the github and was able to run it. I am still NOT able to login. I get to the login screen, but admin/admin or user/user does nothing. I originally followed your video trying to get this to work with mudblazor. I like the layout .. collapsible navigation, but I got a blank screen.. Any pointers on how to get your github to work correctly would be greatly appreciated. Keep up the great work.
Hope you got the code from the below github repo: github.com/codingdroplets/BlazorWasmAuthenticationAndAuthorization This is the same project which we are showing in the video. Are you facing the issue while running the same project?
You're welcome! Implementing a refresh token mechanism in Blazor WebAssembly involves a combination of strategies like storing the refresh token securely, checking its expiration, and making requests to the server to obtain a new access token. We'll soon include a video on this topic.
The real business scenario is that after a user logs in successfully, they obtain a Token and obtain a menu. In Blazor's WASM mode, without configuring a policy, how can they avoid entering a routing address in the browser address bar and navigating to a page that they do not have permission to access？
Thanks for your comment and question. In our Blazor WebAssembly project, we have implemented role-based authentication to control access to resources based on the roles assigned to each user. We have defined roles using the Authorize attribute to restrict access to pages and components. This way, only the users who have the required roles can access the protected pages or components.
Please publish the source of this tutorial. I did all the things mentioned in the video. But in the method call (Login) the value of loginResponce.IsSuccessStatusCode is equal to (False). I also put BreakPoint in the login method of AccountController, but it does not enter the method
Please check the below project in which I've used Local Storage for saving User Session details. Inside CustomAuthenticationStateProvider, you can see a constant named SESSION_VALIDITY_MINS (for Session Duration). The constant value can be changed based on your need. Also I suggest you to implement some encryption while saving the data. github.com/codingdroplets/BlazorServerAuthenticationAndAuthorizationWithLocalStorage
Please make a tutorial of aspNet web api + Blazor webassembly (not a `BlazorApp` or `Blazor Server` templates) Identity auth tutotial (new way, .net 8). register, login, logout features
Thank you for watching my video and leaving such a positive comment, your feedback means a lot to me and motivates me to continue creating content that you and others will enjoy!
In the video, I demonstrated how to do authentication in Blazor WebAssembly. To accomplish this, I utilized an HTTP POST request in the server-side API to send and handle the user's username and password securely. This approach is a common practice for handling user authentication securely.
I have great hope for this series but I am worried that the videos will stop before instructions are given showing how to actually use what you have taught. Every other Blazor series I have come across, including those from Pluralsight, goes into great detail on how to create a site on a personal computer but does not explain how to publish it. Without publishing, a site is completely useless unless family members are the only intended users. I am hoping that, unlike every single other instructional videos in the world, you are going to explain in detail how to publish a site that uses Authorisation and Authentication. Perhaps the reason nobody bothers to explain how to do this is because it it too difficult, this rendering everything nothing more than an academic exercise. Another possibility is that it is so incredibly easy that the authors think it would be insulting peoples intelligence to assume they need help.
Thank You for sharing your valuable thoughts. Publishing a Blazor application is pretty same as how we publish any other .Net Core web application. As you know, .Net Core web applications can be hosted in Windows, Linux and Mac platforms. The steps may differ based on the OS and Web Server you are using. We have already done a video showing how to publish Blazor Apps using Docker. Below is the URL. th-cam.com/video/ZCJKiwTMTSs/w-d-xo.html Please let us know in which OS you need to deploy the application. Based on that we'll share you the steps to follow.
@@CodingDroplets Hello, I apologise for the delay but I dd not notice your last line. I am using Visual Studio 2022 on a Windows 11 PC and wish to publish to Azure. Let me take this opportunity to say that the more I study your videos, the more I value them. I have not found any others that come close to covering such important subjects so clearly. Providing the source code helps enormously. Please accept my gratitude.
You can find the source code for the project in the GitHub repository associated with the tutorial. Here is the link: github.com/codingdroplets/BlazorWasmAuthenticationAndAuthorization
honestly if you 100% follow this video your app will not work. there was missing step in this video. you need download the full source code and compare with yours which lines was missing.
Thank you for your comment and feedback on the tutorial! I apologize if there was a missing step in the video that caused confusion or issues while following along. I would like to assist you further and understand the specific missing step you encountered. Could you please provide more details about the step that was missing? This will help me identify the exact point where you faced difficulties and provide you with the necessary guidance to resolve the issue.
Thank you for your interest in the source code! You can find the complete source code for the "Blazor WASM Authentication and Authorization" tutorial on our GitHub repository. Here's the link to access the source code: github.com/codingdroplets/BlazorWasmAuthenticationAndAuthorization Feel free to explore the repository, download the code, and use it as a reference for your own projects. If you have any further questions or need assistance, please don't hesitate to ask. Happy coding!
Thank you for watching the tutorial and for your comment. I understand your concern about using a hardcoded user list and your request for a real-world example. In the tutorial, I used a hardcoded user list to make the development process faster and to keep the focus on the authentication and authorization process itself. That being said, I agree that a real-world example with a database would be more appropriate for a production environment. In future tutorials, I will make sure to include real-world examples that cover such scenarios in more detail. Thank you again for your feedback and for watching my videos.
Thank you for taking the time to watch my tutorial and leaving your feedback. I appreciate your comment and I will take it into consideration for my future videos. I understand the importance of being concise in my language and will work towards improving it. Thank you once again for your input.
When generating the app and logging in with any user it gives me the following error "System.ArgumentException: 'IDX12401: Expires: '9/4/2024 10:51:30' must be after NotBefore: '9/4/2024 14 :31:30'.' ". It happens in the JwtAuthenticationManager class, in the line of code: "var securityToken = jwtSecurityTokenHandler.CreateToken(securityTokenDescriptor);" Do you have any idea why?
Thank you for your comment and for reaching out with your concern. The error you're encountering, "System.ArgumentException: 'IDX12401: Expires: '9/4/2024 10:51:30' must be after NotBefore: '9/4/2024 14:31:30'," typically occurs when the expiration time for the JWT token is set to a time that precedes the time at which the token is being issued (NotBefore). To resolve this issue, ensure that the expiration time (Expires) for the JWT token is set to a future time relative to the current time when the token is being issued. Double-check the configuration in your JwtAuthenticationManager class to verify that the expiration time is correctly calculated. If you're still encountering issues, please review the source code available at this link (github.com/codingdroplets/BlazorWasmAuthenticationAndAuthorization) to compare it with your implementation and identify any discrepancies.
@@CodingDroplets Thank you for your reply. The problem was the UTC format. I replaced DateTime.Now with DateTime.UTCNow in the JwtAuthenticationManager class, on the line: var tokenExpiryTimeStamp = DateTime.UtcNow.AddMinutes(JWT_TOKEN_VALIDITY_MINS);
on jwtAuthenticationManager.cs line 50 I'm getting this System.ArgumentException: 'IDX12401: Expires: '6/19/2022 1:27:06 AM' must be after NotBefore: '6/19/2022 8:07:45 AM'.'
![Blazor Tutorial C# - Part 1 | Blazor Basics in 30 Mins [Blazor Development] | Razor Pages](http://i.ytimg.com/vi/dY_AWdCzsCY/mqdefault.jpg)
![[UNCUT] บอสพอล แผลงฤทธิ์ บอสพระ-นักร้อง ก. โดนแฉยับ! I คนดังนั่งเคลียร์ I 21 ต.ค. 67](http://i.ytimg.com/vi/XKf6HeftoPI/mqdefault.jpg)
![CAMPปลิ้น | EP.83[1/2] เปิดแคมป์หลอนต้อนรับ 2 ตัวพ่อแห่งวงการผี!](http://i.ytimg.com/vi/2uPuHYHgwiI/mqdefault.jpg)
This is the only, the most complete, simple and clarified tutorial on the whole TH-cam about Blazor WebAssembly Authorization & Authentication. Thank you.
Thank you for taking the time to watch the video, and for leaving your feedback! I'm glad that the video was helpful to you and that you found it to be the most complete, simple, and clarified tutorial on the topic available on TH-cam.
Here is professionalism:
- Explain complex things in simple terms
- High quality video
- High sound quality
If it's possible, please create you official web site for your tutorials, It's will be better then a lot of world university programs
Respect!!!!
Thanks for taking the time to let me know how you feel! It really makes me happy to hear. An official website is there in our roadmap.
Your tutorials are beautifully explained and concise. Please continue with this series.
Thank You!..
Brilliant Work! This covers a lot of the areas required for custom Authentication in Blazor. Very well put together, and very well presented. Thanks guys.
Welcome! Glad to know you liked it.
Thankyou for this tutorial. This is the first one I've found that explains how to succinctly add Authentication to a Blazor app without having to use the built in stuff and allowing us to implement our own authentication scheme. This is essential to me as I am trying to create a Blazor front end to an existing legacy system that has its own authentication system that can't be changed.
You are most welcome! Glad to know that it helped. Thanks a lot for sharing your feedback.
Wow, the quality and professionalism in this video is so much better than the videos earlier in the series. Well done on improving. 👍🏻
Thank you so much for taking the time to watch and comment on my video! I really appreciate your kind words and am thrilled to hear that you noticed an improvement in the quality and professionalism of this video compared to earlier ones in the series.
I've been working hard to refine my skills and techniques to make each video better than the last, and your feedback is a great encouragement to keep going.
Thanks again for your support and I hope you continue to enjoy my content!
You are a lifesaver! This is exactly what I needed. I was able to slightly adapt this for authentication against LDAP.
Great to hear!
Thanks for the Video and the Series!!!! They are both Great
Glad to hear that
💥Host Your Blazor App in Linux: th-cam.com/video/bXK-F-uL7Qo/w-d-xo.html
🔗Blazor Tutorial Series Playlist link:
th-cam.com/play/PLzewa6pjbr3IQEUfNiK2SROQC1NuKl6PV.html
One thing about the custom authentication state provider class you created. There is no need to await a Task.FromResult. You are already in an async method, so just return the object. No need to create a new Task in the method and await it. That just creates a useless thread switching context that is not needed.
Also, Base64 Encoding is not "encrypting". For anyone watching this video, if you are relying on Base64 encoding something to be "encrypting it" you are not secure by a long shot.
You are a legend... That's a good point
Excelent tutorial, was looking for this so long !!! Thanks
You're welcome! Glad to hear that.
Waiting for more vedios. Your way of teaching is amazing sir.
Thank You so much!
I have been following your entire Blazor tutorial playlist. All the videos have been very helpful. However the final two, the Auth tutorials, were very fast, and you spent most of the time pasting in code rather than typing out and explaining it. I have completed the auth tutorials, but I am left still with questions about exactly 'what' I wrote, and how/why it works.
I would prefer it if these auth videos were longer, and you took the time to explain what each step of the auth flow was actually doing.
Thank you for taking the time to leave a comment and for following my Blazor tutorial playlist! I appreciate your feedback on the Authentication and Authorization videos, and I apologize for any confusion or frustration caused by the pacing and level of detail in those tutorials.
I understand that the Authentication and Authorization topics can be complex, and it's important to have a clear understanding of the code and flow involved. I will take your feedback into consideration for future tutorials and aim to provide more thorough explanations and details on each step.
If you have any specific questions or concerns about the code in those videos or other related topics, please feel free to let me know in the comments section. I'm always happy to help clarify and provide additional resources where possible. Thanks again for your support and for watching!
Really great stuff !! I was looking for that for more than 1 year now !
This approach really gives you much more flexibility than Windows Identity.
Maybe just one little thing. In the LoginRequest the password is sent in clear text to the Web Api !
Thank You for sharing your thoughts! Glad to know you liked.
As you mentioned in the comment, we can encrypt the password in the request. Will include that in an upcoming video.
Excelente! Congratulations, César, Colombia
Thank you so much!
Great tutorial. Simple and clear. Can you please implement the registration in the next video? Need it a lot. Thank you!
Sure. Will do a video for registration soon. Thank You for your valuable feedback.
This is awesome, easy to understand and follow along. However in which part of the video, did you set the value for the "ExpiryTimeStamp"? In GetToken method there's is validation where you compare the DateTime.Now to ExpiryTimeStamp. Thank you
Thank You! The validation is in the GetToken method of CustomAuthenticationStateProvider (in WebAssembly Application)
Great channel! I am wondering if you are going to continue this series.
Thank you for your positive feedback. Glad that you're enjoying our channel and finding the content valuable. We'll be including more videos in the series soon.
Thanks for the explanation, it was nice. However, the token contains name, surname and role information. It is generally not preferred to get it with a different parameter 👏
Thank you for watching and for your feedback!
Sometimes you like a video and when you are going to hit a like you just know you already liked it few seconds ago.
Thank you so much.. pls don't hit like button twice 😅
@@CodingDroplets Well just hope it is an odd number of times =)
Thank you great video!
Could you give me some advice on how to implement reading custom user information? E.g. avatar url, nickname or its description? It's not clear to me where I should call this readout and where to store this information in the front-end. Thank you
You can add multiple claims or you can add the Unique ID of the logged in user in claims. Then fetch the remaining details like Avatar URL, Nickname etc from DB.
If you've added UserAccountId in claims, you can fetch it as below.
var authState = await AuthenticationState;
var userAccountId = authState.User.Claims.GetClaimsValueByType("UserAccountId");
@@CodingDroplets Thank you for answer :)
Forgot to mention the extension method named GetClaimsValueByType. This method will fetch the value from claims. Below is the method.
public static string? GetClaimsValueByType(this IEnumerable claims, string claimType)
{
string? result = null;
if (claims != null && claims.Count() != 0)
{
var claim = claims.Where(x => x.Type == claimType).FirstOrDefault();
if (claim != null)
result = claim.Value;
}
return result;
}
@@CodingDroplets Thanks again for your time and willingness to help :)
You're welcome
Good tutorial, congratulations, for me as a neophyte it was very useful. I was wondering, based on your example as-is, if the attributes [AllowAnonymous], [Authorize(Roles = "Administrator")], etc. they can also be applied in server-side CRUD controllers. I tried it but it doesn't seem to work, what can you recommend?
Thank You! Glad to know you find it useful.
In the demo application we've already implemented the attributes in server side. You can find the source code in the below URL. Please verify your code.
github.com/codingdroplets/BlazorWasmAuthenticationAndAuthorization
@@CodingDroplets Yes, I noticed this in your example, however if I apply it to my controllers working together with Interfaces and ServicesManagers in REST mode, these attributes (except [Anonymous]) are blocking.
Have your provided the authorization header in the API request (as shown below)?
Http.DefaultRequestHeaders.Authorization = new AuthenticationHeaderValue("bearer", token);
@@CodingDropletsFANTASTIC!!! Although I wrote the step-by-step code while following the video, I didn't notice that I left out this line of code. Now everything works fine! I really don't know how to thank you, you were very kind.
Great!!! You are most welcome. Thank You!
Nice Tutorial, Thank You!
Welcome
Hello, your video is interesting, I made the mistake of using the individual accounts option in my project, and the identity server was installed which is impossible to deploy on a web server. There is no information on how to do it and it is frustrating since neither Microsoft nor Duende Software tells you how to configure it. Now, my question is there is a way to use this identity server in production ?
Thank you for watching the video and for sharing your concern about deploying the identity server in a production environment.
Using an identity server in production is indeed possible and widely done. While the specific deployment process may vary depending on your hosting environment and requirements, I can provide you with some general steps to guide you:
Prepare your environment: Ensure that you have a suitable hosting environment for your identity server. This could be a virtual private server (VPS), a cloud-based infrastructure, or a dedicated server.
Configure the identity server: Set up your identity server by following the installation and configuration instructions provided by the identity server framework you are using. Microsoft's Identity Server and Duende IdentityServer are two popular options.
Secure the identity server: Implement appropriate security measures for your identity server, such as using HTTPS for secure communication, securing sensitive configuration data, and applying necessary authentication and authorization mechanisms.
Configure client applications: Update your client applications, such as your Blazor WebAssembly application, to use the deployed identity server for authentication and authorization. This involves configuring the client applications to use the correct client settings, including the client ID, client secrets, and redirect URIs.
Test and troubleshoot: Thoroughly test your deployment to ensure that the identity server is functioning as expected. Pay attention to error handling, logging, and any specific requirements of your hosting environment.
Regarding specific instructions for deploying the identity server in your chosen hosting environment, it is best to consult the official documentation provided by Microsoft or Duende Software. They usually provide detailed guides and documentation on deployment scenarios, including considerations for different hosting options.
I understand that the lack of readily available information can be frustrating, but with careful research and possibly seeking support from the framework's official channels or community forums, you should be able to find the necessary guidance for deploying your identity server in production.
Remember to always follow security best practices, keep your software and dependencies up to date, and regularly monitor and maintain your deployed identity server.
@@CodingDroplets Hi, thanks for your reply, but after having tried to deploy my project without success. I did a simple test, I created a Blazor Wasm project, using individual account authentication, just use the default template, then i added the duende license. I verified that it works on my pc without problems or errors and finally I deployed it on the server.
Couldn't get it to work because of a bunch of bugs that weren't supposed to happen.
I'm sorry to hear that you encountered difficulties when trying to deploy your project with individual account authentication and the Duende license. Deployment issues can indeed be frustrating, especially when unexpected bugs arise.
While it's difficult to pinpoint the exact cause of the bugs without more information, I can offer some suggestions to help troubleshoot and resolve the deployment problems:
Double-check the deployment environment: Ensure that the server meets the necessary requirements for hosting your Blazor WebAssembly application. Check the version of .NET runtime, operating system compatibility, and any other dependencies or configurations specific to your application.
Review the error messages: Analyze the error messages or log files generated during the deployment process to gain insights into the nature of the bugs. Error messages can provide valuable clues about what went wrong and help narrow down the possible causes.
Update dependencies: Make sure that all the dependencies, including the Duende license, are up to date and compatible with your deployment environment. Check for any known issues or updates related to the specific versions you are using.
Test with a minimal project: Consider creating a minimal, stripped-down version of your project that focuses solely on the authentication and deployment aspects. This can help isolate and identify any specific code or configuration issues that might be causing the bugs.
Seek support: Reach out to the official support channels of the Duende Software community or Microsoft's Blazor community. They can provide guidance, offer insights based on similar experiences, and help troubleshoot the specific problems you're facing.
Remember that deploying an application involves various factors, including the hosting environment, configuration settings, dependencies, and code itself. Sometimes, unexpected issues can arise, and it may require careful investigation and collaboration with the community or official support channels to identify and resolve them.
@@CodingDroplets Yes, deploying involves lots of things, for example the key, appsetings for production, how to store the key (file or store) the certificate pfx and much more. As i said to you, its almost impossible to do it. And i can see no body can't do it, because there is not any video with that topics.
I asked myself why not microsoft advice the great problems will we have adding this option of individual accounts. Maybe, we can develop a more simple authentication provider, but simpler to develop.
Thanks, and i hope you be the first one to prepare a video with a real scenario that is to develop a blazor Wasm in a IIS server.
@@CodingDroplets i forgot to answer you that Duende web page shows examples that have different classes that Visual Studio added to the project, its very difficult to try to understand what you have do.
So, I'm getting an issue where the client doesn't respond to the API's token. No session set for example.
Swagger though, shows that the token is generated as the returned Dto has the correct, populated fields from the Login controller.
Any ideas? I'm at a loss. I went through the video twice to see what I missed, I can't find it.
Source code is available in the below github repository.
github.com/codingdroplets/BlazorWasmAuthenticationAndAuthorization
Please compare with your code. Especially the program.cs class and CustomAuthenticationStateProvider class.
Thank you for the video. But I have one question.When I click on the menu or home logo without logging in, this message appears. -> RolesAuthorizationRequirement:User.IsInRole must be true for one of the following roles: (Administrator|User) -> I haven't been able to find a solution for over a week.
Thank you for watching the video, and I appreciate your question. The message you're encountering indicates that there is a role-based authorization check that is not passing when accessing certain resources without being logged in. To further diagnose the issue, compare your source code with the code in the GitHub repository:
github.com/codingdroplets/BlazorWasmAuthenticationAndAuthorization
@@CodingDroplets I downloaded and ran your code, but I keep getting the same problem. -> Press F12 and click on the Console tab. -> If you click the home button or menu button without logging in -> you will get this message: RolesAuthorizationRequirement:User.IsInRole must be true for one of the following roles:(Administrator|User)
thank you so much. excelent content
Thank you for your comment, Arash! I'm glad you found the video helpful. If you have any questions or suggestions for future content, please don't hesitate to let me know. Thanks again for watching!
Is this something that can be implemented to a maui hybrid app project? And let that work for both web and mobile platform.
Please refer th-cam.com/video/cZtcAuy0100/w-d-xo.html
Can you implement policy/permission base Authorize example ?.
Thanks
Will include policy based authorization in upcoming videos.
Thank you for the video. Very nice job. I just have one question. I'm using .Net7. I've downloaded your source code and compared my files to yours. It all seems to be the same. The problem is that when I click the Log In button nothing happens if the credentials are correct. If they are wrong, I get the Alert message. So, I ran your source code directly and I have the same problem. I try to Log In but when I click the button nothing happens with the correct credentials. If the credentials are wrong, I get a loginResponse StatusCode of Unauthorized. This is correct. But if the credentials are correct, I get a loginResponse StatusCode of Internal Server error. Is this a .net7 issue? If not, how do I fix this?
Thank you for your feedback and for trying the project from the GitHub repository. I'm glad you found the video helpful!
I've tested the project from the repository and it's working as expected, which suggests that the issue might not be related to the project code itself. When you're facing problems like this where the code appears to be correct, but something is not working as expected, it's a good practice to check the browser's developer console for any erros.
@@CodingDroplets Thank you for your response. I tried tracking down the issue and this is what I found. I get and exception thrown in the "private Task InvokeNextActionFilterAsync()" method in ControllerActionInvoker.cs file. The error says: 10/20/2023 7:38:48 AM' must be after NotBefore: '10/20/2023 11:18:51 AM. 7:38:48 AM is the local time here now on the east coast of the U.S. 11:18:51 is UTC 20 minutes ago. Could this be a problem with this code not working depending on your time zone?
Thank you for the tutorial, but is there any way I can stop two same user from login at the same time?
You're welcome! To prevent multiple instances of the same user from logging in simultaneously, you can implement session management in your Blazor WebAssembly application.
You can achieve this by using a server-side mechanism to track active sessions for each user. When a user logs in, you can mark their session as active. If the same user tries to log in from another browser or device, you can check whether they already have an active session. If so, you can choose to prevent the new login or terminate the existing session, depending on your application's requirements.
It's important to note that implementing this kind of session management may require some server-side logic, and you'll need to consider how to handle session expiration and user actions, such as logout. The exact implementation will depend on your application's architecture and security requirements.
I got the github and was able to run it. I am still NOT able to login. I get to the login screen, but admin/admin or user/user does nothing. I originally followed your video trying to get this to work with mudblazor. I like the layout .. collapsible navigation, but I got a blank screen.. Any pointers on how to get your github to work correctly would be greatly appreciated. Keep up the great work.
Hope you got the code from the below github repo:
github.com/codingdroplets/BlazorWasmAuthenticationAndAuthorization
This is the same project which we are showing in the video. Are you facing the issue while running the same project?
@@CodingDroplets I am getting An unhandled error has occurred. Reload on the mudblazor version. Blank screen and that message on the bottom.
Thank you ,, How do I use a refresh token?
You're welcome! Implementing a refresh token mechanism in Blazor WebAssembly involves a combination of strategies like storing the refresh token securely, checking its expiration, and making requests to the server to obtain a new access token. We'll soon include a video on this topic.
The real business scenario is that after a user logs in successfully, they obtain a Token and obtain a menu. In Blazor's WASM mode, without configuring a policy, how can they avoid entering a routing address in the browser address bar and navigating to a page that they do not have permission to access？
Thanks for your comment and question.
In our Blazor WebAssembly project, we have implemented role-based authentication to control access to resources based on the roles assigned to each user. We have defined roles using the Authorize attribute to restrict access to pages and components.
This way, only the users who have the required roles can access the protected pages or components.
@@CodingDroplets Thank you for your answer！I'll try it later
Please publish the source of this tutorial.
I did all the things mentioned in the video. But in the method call (Login) the value of loginResponce.IsSuccessStatusCode is equal to (False).
I also put BreakPoint in the login method of AccountController, but it does not enter the method
The source code is available in our Github Repository. Below is the URL.
github.com/codingdroplets/BlazorWasmAuthenticationAndAuthorization
@@CodingDroplets tanx tanx tanx
Most Welcome!
Do I need to understand this?
oh my
so much thank you !!
You are welcome. 🙂
Very Good Video.
Thank You!
Thank you
Most Welcome! Thank you for the continued support.
just amazing!
Thank you for your positive feedback on the tutorial. I'm glad to hear that you found it amazing.
Very Good! 👌
Thank you very much!
can you do actual database on the user side sir?
I'll certainly consider creating a video on this topic soon. Thank You!
@@CodingDropletscan't wait on that bro.
Hello, is there any way to make browser save login and password (or at least login) for the next session? Thank you very much!
Please check the below project in which I've used Local Storage for saving User Session details. Inside CustomAuthenticationStateProvider, you can see a constant named SESSION_VALIDITY_MINS (for Session Duration). The constant value can be changed based on your need. Also I suggest you to implement some encryption while saving the data.
github.com/codingdroplets/BlazorServerAuthenticationAndAuthorizationWithLocalStorage
I’m getting an error in the login.razor page with regards to car loginResponse = await….
Error is saying an invalid request URI was provided
This error occurs when the login button is pressed
Source code is available in the below github repo. Please verify the code.
github.com/codingdroplets/BlazorWasmAuthenticationAndAuthorization
@@CodingDroplets thank you
thank you so match
Thank you for taking the time to leave a comment and I'm glad to hear that the video was helpful to you!
Please make a tutorial of aspNet web api + Blazor webassembly (not a `BlazorApp` or `Blazor Server` templates) Identity auth tutotial (new way, .net 8). register, login, logout features
Thank you for your suggestion! I appreciate your interest. I'll definitely consider creating a tutorial covering those topics
Thanks
You are most welcome. Thanks a lot for the support! ❤
@@CodingDroplets thanks for sharing knowledge with us it will be very helpful in our future
Glad to know you liked it. Thank you for sharing your thoughts.
@@CodingDroplets we will be pleased if you make a tutorial on MAUI
Will be starting the series soon.
excellent
Thank you for watching my video and leaving such a positive comment, your feedback means a lot to me and motivates me to continue creating content that you and others will enjoy!
@@CodingDroplets I have to thank you for this amazing tutorial, god bless you man 🙏🙏
God bless you too! 🙏🙏
How can Use Post
In the video, I demonstrated how to do authentication in Blazor WebAssembly. To accomplish this, I utilized an HTTP POST request in the server-side API to send and handle the user's username and password securely. This approach is a common practice for handling user authentication securely.
I have great hope for this series but I am worried that the videos will stop before instructions are given showing how to actually use what you have taught.
Every other Blazor series I have come across, including those from Pluralsight, goes into great detail on how to create a site on a personal computer but does not explain how to publish it.
Without publishing, a site is completely useless unless family members are the only intended users.
I am hoping that, unlike every single other instructional videos in the world, you are going to explain in detail how to publish a site that uses Authorisation and Authentication.
Perhaps the reason nobody bothers to explain how to do this is because it it too difficult, this rendering everything nothing more than an academic exercise.
Another possibility is that it is so incredibly easy that the authors think it would be insulting peoples intelligence to assume they need help.
Thank You for sharing your valuable thoughts.
Publishing a Blazor application is pretty same as how we publish any other .Net Core web application.
As you know, .Net Core web applications can be hosted in Windows, Linux and Mac platforms. The steps may differ based on the OS and Web Server you are using.
We have already done a video showing how to publish Blazor Apps using Docker. Below is the URL.
th-cam.com/video/ZCJKiwTMTSs/w-d-xo.html
Please let us know in which OS you need to deploy the application. Based on that we'll share you the steps to follow.
@@CodingDroplets Hello, I apologise for the delay but I dd not notice your last line.
I am using Visual Studio 2022 on a Windows 11 PC and wish to publish to Azure.
Let me take this opportunity to say that the more I study your videos, the more I value them.
I have not found any others that come close to covering such important subjects so clearly.
Providing the source code helps enormously. Please accept my gratitude.
I would like to hear from you
🙂
Please provide the source code?
You can find the source code for the project in the GitHub repository associated with the tutorial. Here is the link: github.com/codingdroplets/BlazorWasmAuthenticationAndAuthorization
honestly if you 100% follow this video your app will not work. there was missing step in this video. you need download the full source code and compare with yours which lines was missing.
Thank you for your comment and feedback on the tutorial! I apologize if there was a missing step in the video that caused confusion or issues while following along.
I would like to assist you further and understand the specific missing step you encountered. Could you please provide more details about the step that was missing? This will help me identify the exact point where you faced difficulties and provide you with the necessary guidance to resolve the issue.
Source Code?
Thank you for your interest in the source code! You can find the complete source code for the "Blazor WASM Authentication and Authorization" tutorial on our GitHub repository.
Here's the link to access the source code: github.com/codingdroplets/BlazorWasmAuthenticationAndAuthorization
Feel free to explore the repository, download the code, and use it as a reference for your own projects. If you have any further questions or need assistance, please don't hesitate to ask. Happy coding!
@@CodingDroplets Thanks
You are most welcome! 🙂
I have a problem, when I store the email and the role it shows in the session storage using f12 how to hide it
Please provide REAL WORLD example. In reality, we not going to have a user list in memory. Shortcuts confuse noobs.
Thank you for watching the tutorial and for your comment. I understand your concern about using a hardcoded user list and your request for a real-world example.
In the tutorial, I used a hardcoded user list to make the development process faster and to keep the focus on the authentication and authorization process itself.
That being said, I agree that a real-world example with a database would be more appropriate for a production environment. In future tutorials, I will make sure to include real-world examples that cover such scenarios in more detail.
Thank you again for your feedback and for watching my videos.
@@CodingDroplets create a database with user table. then reverse engineer with entity framework. u ll get the class.
ComPOnent. Not COMponent. Also to save time, you can say 'has' instead of 'is having'
Thank you for taking the time to watch my tutorial and leaving your feedback. I appreciate your comment and I will take it into consideration for my future videos. I understand the importance of being concise in my language and will work towards improving it. Thank you once again for your input.
@@CodingDroplets anytime, thanks for your effort btw, it’s been very helpful. Where did you gain this knowledge?
When generating the app and logging in with any user it gives me the following error "System.ArgumentException: 'IDX12401: Expires: '9/4/2024 10:51:30' must be after NotBefore: '9/4/2024 14 :31:30'.' ". It happens in the JwtAuthenticationManager class, in the line of code: "var securityToken = jwtSecurityTokenHandler.CreateToken(securityTokenDescriptor);" Do you have any idea why?
Thank you for your comment and for reaching out with your concern. The error you're encountering, "System.ArgumentException: 'IDX12401: Expires: '9/4/2024 10:51:30' must be after NotBefore: '9/4/2024 14:31:30'," typically occurs when the expiration time for the JWT token is set to a time that precedes the time at which the token is being issued (NotBefore).
To resolve this issue, ensure that the expiration time (Expires) for the JWT token is set to a future time relative to the current time when the token is being issued. Double-check the configuration in your JwtAuthenticationManager class to verify that the expiration time is correctly calculated.
If you're still encountering issues, please review the source code available at this link (github.com/codingdroplets/BlazorWasmAuthenticationAndAuthorization) to compare it with your implementation and identify any discrepancies.
@@CodingDroplets Thank you for your reply. The problem was the UTC format. I replaced DateTime.Now with DateTime.UTCNow in the JwtAuthenticationManager class, on the line:
var tokenExpiryTimeStamp = DateTime.UtcNow.AddMinutes(JWT_TOKEN_VALIDITY_MINS);
on jwtAuthenticationManager.cs line 50 I'm getting this System.ArgumentException: 'IDX12401: Expires: '6/19/2022 1:27:06 AM' must be after NotBefore: '6/19/2022 8:07:45 AM'.'
Please try providing DateTime.UtcNow instead of DateTime.Now in tokenExpiryTimeStamp.
@@CodingDroplets That fixed my issue with plain blazor project. Thanks.
Welcome
thank you
You're welcome