Golang HTTP User Authentication Yabi Series 20 | Golang Web Development | WebAssembly Auth System

Video Statistics and Information

Video
Captions Word Cloud
Reddit Comments
Captions
[Music] hello guys welcome back to the channel this is the churro series number 40 here in marligan's code okay um this is uh the continuation or probably this is our last part of our yabby series here guys and uh thank you so much for uh all your support here in harlequin's code by uh subscribing and uh watching my uh tutorial series here in marlin scout and i hope i impart with you uh some decent knowledge i may say okay and then this is now our yabby series number 20 uh and then um after this we will uh finalize our yabi package this is what we call authentication uh golang authentication system that we built from scratch as well so um uh probably i hope you learned a lot here in malacanang school guys i will learn together guys okay so uh this would be our last uh section here the last series for uh yabby series and then after this uh we will have uh to finalize this jrb package and then we will publish it on our iti republic github and then so that you can go get this new package that we have just finished and then we i will share it to you guys out there so that every time we have a new authentication system or login system that we need in our golang web development system that you are about to do uh that one you can maybe you can try to do or probably you can use it this one is for free guys so no worries about that okay just give a feedback or something or whatever guys and then thank you so much for those people who commented very nicely here in markets code uh if you want to be shout out here in marlinkinsko do you you want to be honored here in our youtube channel um please comment down below uh with your very nice comment guys and um so that we can read it in our last section of our uh every tutorial video here in harlequin's code okay guys uh we will continue this uh change password inside the dashboard there so probably this is our last uh feature for for this um yabi series and then uh again we need to finalize it uh so that we can use it what they call this easily when we publish it on our github so let's dive into this tutorial guys back to the channel okay we're about to continue guys this one we need to create a new page on static page with a simple uh form guys uh probably we will have some uh total of three input box that we require for the user to authenticate uh their current password and then the new password and of course the confirmation password this is the standard way of doing uh password change guys so okay so we will do this under this dashboard.go under this uh api package here so as of this moment we only have a dashboard page but we need to create uh what they call this uh change password which is the new page uh again this is a all the dashboard route routers uh would be under the protection or under the umbrella of this uh what they call the yabby login required if you require this yabi login required here this would be this page are all protected pages okay so and unlike for our previous uh what they call this another router here which is our public routers i mean the public pages these are all required this one no need for us to display or require an authentication so this one is a publicly accessible pages so we don't want to wrap it with this yabi login required so if you are using this login you'll be required in your project i suppose uh you can probably use this uh login required guys so uh this code will will be working uh for your new project and go link project there so at the moment we need to create a new one guys so probably this one is for the change password so i just want to copy this one okay just uh copy these and then we just want to change guys we will name this as a change password okay um this link would be uh change uh this one is under the change password and then now we need to create this one guys change password as well but we need to create this one first we just want to copy uh one of our static page here inside the dashboard setting so we just want to copy this exact name here for our function okay function is to render the uh this one is not the user's registration this one is the user's uh change password page this one as well guys we need to change this as well this one is the dashboard page so we just want to uh create a new one instead of the index here we will create a like a change password uh like a change password this one is our new html page guys okay uh i just want to change all these unnecessary things here change password okay so um this one so we need to change this and then change password and then we need to create this one guys so this one is a change password um page i just want to say like that guys change password page okay so these are all the required settings here so uh under this we need to create this under this dashboard here right now there is only index.html but this one i just ignore for a while guys this one is our uh project structure in golang so for the web development so we need to create uh under this dashboard we need to create a new page called the change password dot html to capture our time i i have done this change password html uh we just want to explain a little bit about this this one is a this one is just a basic one guys a basic form here which is the we only require a total uh three input uh box here uh for our users to key in the new password and of course the current password so we require the current password here so that uh we can we need to ask for the old older password unlike for the password reset is uh totally the user cannot log into our system so probably we need to uh provide with the only the email address that we need to require for them to uh for the user to reset the password so we can able to send the password reset uh link to that uh specific user who requests for the password but in this case this uh change password is uh totally inside the dashboard there so the user knows or currently login to the system and then then he just want or the user might want to change the password by itself inside that dashboard there so we need that's why we need to provide this password reset i mean a change password utility for the user so that they can change the password by by itself there so inside the dashboard so we need to create this change password as well this um uh this is a new awesome file here so we need to add a new whatsapp here and under this whatsapp authentication so we need to create uh this one for the new password okay so uh but at the moment uh we just want to run this one first let's see if uh what will happen at least we can see the look and feel of our new page okay guys so we just want to wait for it's still running okay uh the moment we will refresh this change password here so okay so we need to login because this one is authenticated one so at the moment i think my old password is this okay i need to change my password guys i think i forgot my password we just wait oh well i guess okay the 2a small a so just want to let you know guys okay so right now we can see that there is a new link here actually it exists there but uh only the dashboard at the moment this uh url here but uh when we click this okay so we need to add the thing first guys um this one would i would be under the uh hold on guys i need to check further header dash i think this is the this html here so i just want to see the change password link there so we need to provide because right now is just a sharp symbol so we just want to add the new url here which is the change new router so we call it the change password uh if you change the thing you just want to refresh the page guys um okay this one we need to go to the change password okay so now it's displaying guys our new password change i mean the change password page so this is the new page and then uh we just want to put a small notes here uh at the moment we don't have the wasm yet so right now we need to ask the user for the current password here and then of course the new password and then the confirm password and then the user will change the password here so um i put a small note here please take please take note that if after you have successfully changed your password you will be automatically logged out to take effect with your new password so the new password will be uh it will be take take an effect okay so automatically we will log out the user and then we will require the user to log in back of course with the new password okay so this this would be automatically log out so we don't want to display some pop-up message like the those sweet alert so we don't want to display but automatically we just put note here uh after the change password successfully authenticated and then taking it take an effect uh then automatically will redirect to oh automatically we log out the user okay so um this is the thing uh right now we need to do that and then we need to add uh we need to go back to our awesome here we need to add one thing here guys so uh this one we no need for us to put here so no problem guys after this uh i will publish this again to our github harlequins um code so that you guys out there you can uh download the latest source code as of this uh recording okay so this one i also added this photo dash here uh as usual our csrf token uh then after this our base url and then of course our old wasm so okay so probably we can close this just to capture our time i added this change password here from our uh wasam oat directory so this is our main.go for the wasam oat okay this is the change password so ensure that it will be matched here it should be match in the on click event of this uh button here guys so this will be triggered and then later we'll be exposing this change password function from golang so that it will be exposed there to the javascript site so as usual guys you can copy paste all those things but just change with whatever the required inputs there from the user so we just want to carefully change it okay so these are all the standard codes these are all standard codes and then of course we need to capture all those um inputs from the user so again this is our payload here which is the current uh current password this one is just a plain password guess of course because of the because the user the user key in directly the current password may require the user to key indirectly the password guys don't don't give the password directly instead ask the user to provide with the current password uh rather than your key because that one will defeat the purpose guys okay this one is for the security purpose of the user uh anyhow if the if the user just anyhow open this page for example i am the user here um anyhow i leave my desk or something like that so any unwanted users might might not might be accessing the user's uh laptop or uh the machine there and then uh if you don't require this current password you just provide the new password and can run faster than gun case guys uh it will be there's no security at all so unless the user is uh um shut down the pc or laptop or something but it's not recommended guys so you just always ask for the current password if you are uh inside the dashboard here okay so this change password here so always ask for the current password of course uh for the security of uh of the user who access our site so okay so please remember that one and after that um this one is our new api which is a change underscore password here so we will provide with this uh change api here i mean change password this is the new api so we will provide this uh later on okay these are all the standard uh things here so no need for us to explain for because we have done this numerous times okay so we will create this change password guys under this um out here so we just copy one of the existing url there the router change password so probably this one is a change password as well okay change password endpoint so we will provide with another end point here okay okay guys to capture our time again guys okay uh this one we have just i've just created the change password endpoint here so we just copy paste all those existing one we just want to provide with our new inputs here which is the current password and then the new password and confirm password of course this is a standard code to open up the mysql database here the connection because later on we will provide this one again uh under our new on this is the new feature of our yabi package which is called the validate change password so this one would be um change password here so we only require current password new password and conform password these three inputs from the user so if this one it will return a boolean value here and then with the true or false uh this one is the air standard error code guys so here we don't provide uh with the [Music] information here like password reset failed or something so we just want to remove this one guys this one totally we don't want to provide uh the thing so uh probably we can just uh okay we just want to uh oh this one is the under here this side so we just that one just ignore it this one is a s password here because this one is just a standard error display guys so we just want to log whatever the error of this function it might return so in our ipr log okay so this one is a boolean 204 so if this one in this case if this is true this statement is true here if this function returned true guys so successfully change the password so we just want to redirect back i mean redirect the user immediately to the login page so after our api will respond back to this request uh from this one uh in our uh what we call this awesome here so we just want to immediately uh from here redirect url so redirect back to the login page okay so this one we are about to create this uh new yabipakka i mean new yawi function here which is called the validate change password so if error of course is a standard uh error here password change failed or something like that yeah so we just want to change that uh that one is okay okay so we're about to create this okay guys to capture our time again so i added this validate change password under the under this um yabi package here uh inside this user that go so all our validations all the functions uh most of the functions of the yabi package here are located in this user.google so as usual guys this one is we just want to require current password new password and then get forum password now she's well uh we just want to validate those empty strings okay so um new confirm password is not much so just want to check on that in that scenario and then the next one is uh this one is quite straightforward guys oh after all the validation done then um this the thing uh we can just provide the user with the new password okay so uh in this case after all the validation the basic validation pass here so in this case we don't provide with the password strength so probably in our next um enhancement guys for this yabby authentication system so okay so um this get the uh get the user stored hash here so we just use our existing uh function from this yabi here which is uh called the get user password so we just want to require the username of the user currently this one is an automatically we remember that we automatically get the yabi user data when once the user successfully login guys or authentication authenticated so we we provide all those uh in the memory uh we call it the yabby user data so you can access it directly anytime you want uh inside the authenticated pages like the dashboard uh as long as it is inside uh this uh what you call this uh login required uh from our package guys this is a login required so we we can able to get uh who is the current users log login so we can just access it straight straight forward like this yabi uh user data you can access more like email first name last name middle name password but password no uh i think we never provide but this one we never feed this one but this data yabi user data is inside this uh this one gets the yabby user data so uh probably we don't require no password here so we don't give the password but of course uh this is the user's data so there is a password there but in this case always avoid the password to stored um whatever is if it is not secured guys so or accidentally you can access so it always exclude the password every time you get the user's data okay so just to be safe on that one [Music] okay so you can access all those things whatever we provide here in this yabby user data then you can access this uh straightforward guys okay you can access directly okay then after this after successfully get the password hash this one is uh we get it from our what they call this this table which is the yabby table here in our mysql table so we able to capture it okay guys so uh after this we can save this one so again as you as well we have done this we have in our supto package here this is our own package as well now we call it the check check password hash so this one just to compare uh this one also guys is a it's a golang standard way of comparing this is that we call it the b crypt i mean the golden b crypt compare hash and password this one is a default security settings there that go provide for us okay so we don't want to bother much on this okay so after it match all those hash password then after that if it returns this one will return true or false so if it's if it is match and then we can straightforward update the user password we have done this as well so we no need for us uh to create this um new i mean this function to update the user's password so we just want to provide the email and then the new password so straight forward again we can just access this yabi userdata.email because this one we have done in our previous discussion is um update user password so when we go to the definition there uh we can just update the whatever the table here and then the password then we require the email remember that the email is a unique one as well same with the password i mean same with the username username and email is always unique in yabi authentication this is the the good way of we always provide with the unique username and of course the email guys so we don't want to reuse if the the same email address because this one will defeat the purpose as well um this is the best way we can um for our data to be uh to be more uh to be more um secure and of course uh better integration guys so in this way that's why we can just easily if if our data is uh provided with the only email for the user then we can straightforward the reuse whatever we have here so no need for us to recreate a new function just to provide like for example the availability of the data is just a username then we need to change the username unless you want to twist a little bit here but that one we don't want to be more complicated in our function guys so as much as possible we will don't complicate much of your functions there unless it's very necessary and it is required okay so um we will go back here uh to our discussion so this one is the update password is a straightforward in our previous discussion we have done this and then we provide the new password okay only the new password no no no need for us to give the confirm password okay so um this one we have done and um also this one also done so it's time for us to test this uh um this functionality of this a new change password guys so um we need to clear first and then after this um we already provide and then um in this case guys we can always uh again i already set the goose and just to uh test further guys our whatsapp so now uh in your whatsapp um folder there so you always access with your wasa uh file so this one is our wasab here so [Music] so we need to provide the url here this is our source wasab guys so we need to create this one uh ensure that you have uh i mean we need to export that into a binary so in this case and we are in this uh root here so always uh now i'm using the windows machine i just always set goose to just uh every time you boot up your computer or if you restarted the computer then you can set again this uh setting which is the set goose and the set go arcs so it's equal to what's up then you can able to build uh your wasam file your webassembly filer file here so right now i have done this as well so to capture our time guys so it's time for us to build go build then uh hyphen small letter o uh in this case you're able to change um if you have this argument so uh instead of the main.go so you can able to change it with uh another file extension file name like a old.wasabor with the different file extension as well so um right now you can build this one uh instead of the main.com so then the file name should be oat.wasa okay so after i press enter uh if no errors there nothing so it's working guys so our wasam file will be uh updated now it's time to run our web server here okay so we run our project then after this we can test so i just want to refresh i already login guys so probably we can test here folder so just want to check if any errors there so it's not defined defined so i think we need to log out uh at the moment guys so login thing is two okay just want to test so it's not defined yeah we forgot to put this fun guys the csrf token here and then the sweet alert all these things okay so we just want to run it again this one is just a javascript side guys so under the change password so we provide these things but we will check it later on so we need to test for that guys let's see if there's some errors there so at least we can see the the wasam there okay change password okay now we can able to display and find these uh uh this uh sweet alert the javascript side guys okay so current password is required so we just key in with the wrong password first okay password is required password reset failed okay okay you need to test further change password confirm password is required okay we don't want to put password is not match so just change the password password reset page oops unable to get your users identity please try again thank you so because uh i key in the wrong current password so i type another one a small letter a okay so now my current password is a uh two small letter a so right now i change it back to two as well i need to check further guys okay i think i switched back to two okay uh okay my current password is two small letter a and then i change to i change back with the single a let's see what will happen so if i key in the uh two letter a okay now it's uh not working guys it's good now we'll try with the single a click okay now it's successfully changed with the new password guys so as you can see that this one you can close this uh as you can see you just want to refresh further guys um this one um is requiring the current password so if i key in wrong one key okay password reset failed so it well it will automatically redirect back to the um the login page guys so we we log out immediately uh the moment that we found i mean the successful change password so we log out immediately guys so again we need to try further okay with triple a i mean maharikans triple aaa okay able to login log out if uh key in with the single a of course no okay it would be good so um it's up to us in the next uh future discussion guys uh probably will enhance uh further our thing here if uh we don't want to repeat the current password here so we need to log those previous password as well so uh it might be an additional feature for our yabi's authentication system here guys uh probably probably after our after we publish the what they call this yabi package guys so now we have done our yabi series here so the next step would be we will publish this on github site and then we will have some small tutorial on how we can uh further enhance uh probably uh how to use the this yabi package once we publish it on github so probably we can we will have some small tutorial on how you can reuse it in your golang web project okay guys okay guys thank you so much for watching here in mahlegan's code and i hope you enjoy our tutorial series here guys and then we have successfully done our yabby series here so i hope you gain more knowledge here as we as we go further uh in our golan web development series here so thank you so much guys for watching my video here and um stay tuned for our next uh discussion because uh we will publish our yabbi's uh ub authentication system to our iti republic github so so that we can we can do this and then we can go get this one this project and then we can use it hopefully in our uh next uh golang project okay so just uh give some feedback guys uh once we you know what to do a series uh with your nice very nice comment so in our time for our um shout out section here guys so there is one user here called uh henry snoop henry snope thank you so much for coming out with your very nice comment here uh we just give here a free content uh for all of you guys there just to share uh some knowledge especially to our goaling what they call this uh just uh just started the learning goaling or if you are a student or a new um new subscriber here thank you so much guys and then please consider subscribing to my channel so that you guys out there you can uh um by supporting uh my channel here so you can probably just subscribe and then leave a comment a very nice comment there so that i can share it with you guys here in harlequin school thank you so much for watching here guys and uh see you in my next tutorial series here in heart against code may god bless us all thank you and bye bye keep safe everyone [Music]
Info
Channel: Maharlikans Code
Views: 272
Rating: undefined out of 5
Keywords: Life As Software Developer, go, golang web development series 40, golang web development course, web development with go, golang tutorial, learn to create web applications using golang, building scalable web apps in golang, golang good for web development, golang http user authentication, golang http authentication, golang user registration, golang authentication microservice, golang session authentication, golang webassembly, golang mysql, golang mysql tutorial, golang sql
Id: IO7pQNa3SoQ
Channel Id: undefined
Length: 35min 50sec (2150 seconds)
Published: Wed Apr 14 2021
Related Videos
Note
Please note that this website is currently a work in progress! Lots of interesting data and statistics to come.