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

[Music] hello guys welcome back to the channel this is the churro series number 31 here in mulligan's code okay we are in the series in the yabby series number 11. now guys and uh we will continue on with our login system we will now validate our dashboard and then we will create a dashboard page a simple page all the inside the dashboard there will be uh will be a dedicated i mean this one these are all protected pages so we want to protect all those inside the dashboard page we will create a simple uh middleware for these two uh to uh protect our protected pages so uh okay guys and then we will do that and then after that we will do do some testing again for our login page and then um by default we we cannot go directly with that with our protected pages if the for example of like uh mahleken dashboard pages this dashboard page is actually is a protected page guys so we don't want to uh bypass our login system they will defeat our the purpose of these login system otherwise okay so let's dive into this tutorial guys for those people who want to [Applause] honor your name here by publishing your comments please comment down below here guys in our in this video so that in the next video we will have uh our uh we will publish your name here and then of course your comment there at the end of our video tutorial to honor you guys out there okay let's dive into this tutorial guys okay guys we will continue on with our login system welcome back to the channel okay guys this is what we have left out last time guys so we have our payload here token one and then our expiry cookie which is um by default it will expire in 30 days guys and then of course these are all the conditional thing like if the user wants to click on this uh trust me here for 30 days it's up to you guys how you implement this but uh 30 days is a good enough for each system guys if you so that the user will not keep try logging in if they take that for 30 days guys so do you want to trust that computer this computer whatever they are logging in okay so uh we will do that and then after this we will generate some token here this one is the main uh token generator guys so it will generate whatever the payload here so we already have this payload here on top so everything in this data here we will be capturing guys and then we will explode or extract that later on once we are going into those protected pages for example those dashboard out there after we login successfully guys okay so i also i enhance this uh all the javascript here so i mean all our pages and of course guys you can download this js.cookie.js this one i will be added in the link description below guys okay so no worry about this this one is a js cookie as i mentioned in my previous discussion this jsco key is the uh the main purpose is to uh capture whatever the uh we want to insert a new cookie to our to the user's browser guys so that we can store that encrypted username there uh but of course the cookie name is a yabi okay so um we will continue on guys this is a still we're using this amaryllicans user here okay so and then i have done uh no worries about guys i will publish these uh uh updated um what they call these html pages to our harlequins code uh github there so you can uh you guys are there you can grab all these new changes to our what you call the html pages here so i don't want to talk about more about the html side and the javascript side so okay i just closed this on guys and then log in here and so we are focusing on the golang side guys okay so this is the thing now uh we need to continue this okay so okay guys uh and then we added this successfully this uh we need to encrypt this username by using our sago our own package here which is called the toggle page to encrypt those username guys only the username we will try to insert into the user's browser's cookie okay guys uh we need to create at least one dashboard side here guys oh probably we can create a new api here for our routers here guys so we can name it as a dashboard so that means these are all protected pages inside this uh all the routers here guys okay so we will be creating this still the package api okay okay guys i have to capture our time i pasted these scripts for you here guys to catch it on time guys okay uh this is the dashboard routers that we are uh doing guys because we have done this uh you know numerous times in our teacherizer so we don't want to keep typing it again the only thing guys is the this dashboard this dashboard here the new url here the router guys uh this one we will create this new function guys this is uh this is our wrapper here we call it a yabi login required so whatever if you want to our normal one is like um it's like this one only guy so without any wrapper there to protect those pages like for example this uh login or register these are all public pages so we don't want to wrap it with the protection guys so so no need for these pages because they are of course these are all public pages and no need for these pages to be uh protected with the login authentication but now it's a quite tricky part because this one we were about to create this function guys so this would be the probably the layout guys uh in this dashboard this dashboard if you want to directly access access this will access this page which is a the dashboard without the login guys without the valid login account or credentials then probably it will be auto redirect to the login page so because this one is a it it requires a login authentication guys okay so we will create this uh function uh within a function guys okay to return whatever if it is true or not the validation there so we will be doing this and then of course we need this uh encryption guys uh of course to retrieve back from our uh what they call this uh that cookie that we need to set up guys okay but uh before that maybe we can uh remove this uh probably we cannot remove this uh for a moment guys so we want to test uh the what they call this cookie if we really inserted or not so we don't want to protect first let's see it will uh what we can do about this and then uh of course our uh what you call our wasab guys we will be updating our wasab as well so we need to find that the wasam file this the one so we will create this this helper later we will populate guys uh from our yabi uh user this one is uh for the login here we can we want to populate this again guys we need to modify it because we have a few parameters here okay that's all done guys okay so we would like to create those um new uh returns from this uh login guys so we would like to okay hold on guys and this is the one okay so because we have created a new ink username here and then the user cookie expire in days after this redirect url so we will be having this to to return back to the html pages html page guys by using this a wasam of course uh wrap it with the js there okay so we will uh adding this again this one guys then we will uh rebuild our uh what they call this uh wasam there so okay all done guys okay guys uh to catch at that time again guys i pasted this uh i have done this again guys uh what a girl i added these two new rows guys i mean uh new variables here for us uh for from the return of our api uh from our api guys so we would like to capture the username there the encrypted username and of course uh the number of days that the cookie will be expired guys so uh the requirement for the for the requirement for the cookie guys to expire is at least one day guys okay you can also expire it the for few uh this one is in days guys so actually it's a days is enough guys unless the user will log out then automatically we will destroy that we will remove that from the user's cookie guys okay so unless uh like that guys okay this is correct okay then we will check again if there is a cookie there oh okay but actually this one no need okay so this is the tricky part as well guys uh we can add this into our javascript there guys so we will be in injecting this uh user cookie expiring days guys but uh before that don't forget to include uh what they call this uh photo dash include these new cookie guys which is uh what they call this js cookie from these this get up here so this one is very popular guys and also very useful for us don't forget to grab the js but no worries yes i will upload uh the latest source code uh including all these javascript to our marlins code out there so you can just download uh okay guys so all these things so so that you can follow along my discussion here okay so let's uh moving on um this one we need to execute the variable guys and the normal parts in from the from the javascript side there and then we will set it these are the standard code for the javascripts i guess and then this is the this is the rule of the cookie js guys so cookies then set we have this fix user name here this is the cookie name guys later it will be populated i will show you this one right now we are connecting with the 127 the localhost guys uh 0.0.1 then with the port 8080 so when you go to your chrome and now i'm using chrome okay if you are using mozilla maybe you can search along guys on how you can see all the cookies for each site these are all individual sites but now we are using this uh localhost which is having this ja underscore these two cookies here which is the je so and then uh gorilla sees our app now we want to add the one uh new cookie here to be stored guys in each individual users uh browser there we will add this name uh which is the yabi okay it will be appearing here guys uh once we run this uh program okay so we will be um okay guys and then so okay guys um this is uh what i mean we will we will run this one guys uh let's see if it will add these once we successfully authenticate our users guys okay so we can try to go run first let's see okay there's some package here i think we need to go with the helper first guys so okay [Music] because i'm adding this without the thing guys okay hold on okay just save for a while take some time okay uh run okay guys now running uh we would like to don't forget again guys uh to set the goose shika to js uh set the go arcs remember uh you must be in the root directory of your or whatever the oh whatever the what some file you are there guys okay yeah you must be in that directory otherwise you cannot build okay now this one is awesome okay we have done and then i think i have here okay so these are all the things so we'll try to build it guys okay so no errors uh we can try to log in so let's see guys we'll be adding here one uh new cookie here once we have successfully log in guys okay no errors okay so we will try to revalidate again guys okay just put the wrong password simple letter a we'll try to run okay the dashboard is not yet uh loaded guys because we never okay hold on guys i need to we need to add this a new dashboard there this one okay we need to add it on our main the very main route may not go okay we need to register this one guys api dot like this then because we need to we need to add this one okay and then we try to run again let's see no need to rebuild our wasam guys because noah some involvement in this uh thing so we just try to refresh okay so we have our simple uh page here guys actually this one is a dashboard here so we can dashboard up from of course the same template guys we're using the open source template it's just a simple one guys the starting is just that we need to put this logo change password this one is supposed to be the protected page guys but we don't know at the moment we never add that yabby that login required guys for the middleware so later we will add that the middleware or in our next discussion guys okay and we need to check okay i'll try to log in again guys but i need to refresh let's see now the cookies here for the one two seven and zero the localhost guys is now is total three i uh there is another one has been added okay let's see okay uh this is a good indicator guys that we successfully added the yabby here okay so now the yabby cookie is already successfully inserted into the user's browser guys uh the cookie name is yabi and then the content here is our username as you can see it's already encrypted guys actually when you decode this back uh this is the maharikan's username or whatever the username we are there and then these are all the expiry here because i never tick the expiry so the default of the expiry there is a one day guys because we default it to one day okay let's see if we can try to delete uh one more time guys and then uh we will tick uh with the 30 days guys okay we take this 30 days let's see it will be added as 30 days as well so we will go back again and then refresh this page yes this one's not automatic okay uh click the yabi again let's see i did 30 days so okay guys it's good it's the expiration of our cookies added with the past 30 days okay it's working guys and then these are all the cookie here this one later we will collect and then we will decode it back when we authenticate our dashboard or whatever the protected there guys we will we will add this um what we call this uh um the middleware we call it the middleware guys to this is our own middleware so it's easy for us this one we will wrap it with the protected function guys before it will load successfully this page this dashboard page all the protected supposed to be the dashboard routers you will group all together all the protected pages here unlike from our public pages okay by the way this one is the default expiry days this is the involvement of these uh expiry days guys so remember that you always convert it into string guys not the integer value okay because uh when you go back to the when we throw this data back to the javascript there to the html side remember again it's always return as as a string okay otherwise you will not be uh working properly guys okay um this one this one what i'm talking about guys these are all public pages okay uh you always uh split that into a different thing guys so that it will be a little bit organized okay you will be organizing all those protected pages the dashboard routers you group all together here all the protected one guys okay so that it will not be misplaced or something else that you forgot to wrap this one then it's problem guys okay then that page is actually exposed publicly so please be careful on this because this one is very sensitive this part so all the routers here all the urls that you are about to create those pages only you will provide it here all those uh protected ones so we will create that wrapper here uh in a in a short while okay guys okay guys uh welcome back to the channel guys okay um i to capture the time guys i i put back all these things guys uh this is how to wrap these things okay so right now uh we already created this under the new yabi here guys the yabi pro i mean our own helper here i added this setting here guys this is our the main wrapper for this uh function guys okay so this login it requires another function called the endpoint which is the it will require or just pass on whatever the http requests the normal one guys i mean the response and the writer the wr okay and of course we need to pass on the secret key this secret key is a full to decode and encode and decode it but to decode back this is the secret key guys okay uh this secret key is uh this one uh under this uh okay this one guys and our config this is your own uh secret key guys to the encrypt and decrypt the whatever you want to encrypt the crypt guys okay this is very important don't change anyhow here uh the moment you change a little bit you cannot decode bad guys okay because the encryption they will capture all this uh thing uh the one i have a full discussion on my previous videos guys so you can take a look on that guys okay this one is already uh we need to pass on that and then now as you can see that this one is quite uh different from our usually from our usual uh routers guys that we are doing like this get or something okay this one now requires a login this wrapper login required guys okay and then we wrap this page uh when you when you have this public page yes you can directly access this access this page like these guys you can directly access but when you access we will try it later on uh once we access this to our uh once we access it directly without the authentication valid authentication guys which is a username the password of course it will be auto redirect back to the login page it will not successfully come here because this one is supposed to be the protected pages okay and these are all the profile change password then we log out all these things guys okay so right now we need to uh we'll discuss this fully guys in our next discussion guys okay but uh i will just uh give you this uh this one later i will just uh what you call this uh expand in our next video guys okay uh it's just a quick overview one this one is just uh to get the cookie guys so r dot cookie this one is default from the golang r i mean the http request there there is actually a cookie function there to capture whatever the cookie here this cookie this cookie name it requires a cookie name and then it will load the content okay so it will be like these guys and then of course we need to decrypt back the the cookie value okay because this one is uh encrypted so we cannot straight away use it remember that this is the username okay we encrypt the username only no other information we encrypt here this is a this is a good way we can uh we can minimize minimal minimize or whatever guys to uh expose uh information to the user's browser there so we only encrypt the username okay uh and then we can capture the original username here and then of course we can decode back from using this ultima and payload we can decode back and then we auto redirect the log out there so stay tuned for from my next video guys i will just run this just a quick overview i will elaborate um more on our next video guys okay i don't want to drive too much time again guys okay uh okay uh we will be we'll try to delete these guys and then we will try to run to run it okay now inside is running so now once the moment you refresh the page guys it will auto redirect as you notice it will redirect back to the login there as you can see if you can i if i want to go back to the previous page it will not load guys okay even if you want to direct it directly like a dashboard here it will also redirect because you are not authenticated okay this is the process of our login authentication it's a more secure way guys okay now you know uh the feature of this yabi login required here okay once you wrap with this thing any pages there any simple page it will be protected on these guys okay this is the main key here the key okay our wrapper here or middleware okay so but once when i try to put the correct username guys now i'm authenticated guess when i once i click this i will click then it will redirect to the dashboard it is correct okay okay so once you um go back to the login there uh this one we will uh prevent in our next video guys we don't want to put go back to the login page once the user is authenticated so instead it will be just redirecting to somewhere else or dashboard or something else okay but it was and then notice you are already authenticated guys once you go back it is it will load the page because you are authenticated you are our the user specific i mean the specified user's information already in our golang's memory and then of course our cookie here i just want to refresh it's not automatically again so okay just click this the yobi here this is the main key that we are getting from our helper guys this is the main key to get the cookie there okay this is a default from golang and then the cookie name our cookie name is the fixed one which is the yabi there so from our this one will uh enhance further guys because this one i i fixed it the i fix it here uh which is not the uh the good way because this one's a b here you can actually you can rename it uh whatever you want with your own login system so by following this yabi authentication system but of course don't forget mahalikans guys okay thank you so much for your support okay guys um i will elaborate further there's a lot of scripts below there just stay tuned for my next video guys regarding this i will exp i'll explain further about this okay uh no worry guys no worries no worries okay so i'll just delete so once i delete that uh also it will be uh logged out guys okay there's another way i'll i log out i can uh there is a logout here again we just want to refresh it again guys okay the hobby is added back again every time you log in guys okay uh but when i log out here i think i know i never add yet okay um stay tuned in our next video guys okay sometimes uh our life is sometimes funny okay guys uh i think that's all for today guys and then stay tuned for my next video guys now we have successfully authenticated uh our users here okay so we will be adding uh the logout here and the next time so these are all protected pages okay so that's all for today guys and i will elaborate here as i promise guys okay okay guys uh thank you so much for watching my video here and i hope you enjoy uh learning here in malikin's code guys and then you can get um available information especially when you are students or just learn uh golang or we learn together here guys in maharakan's code okay yeah stay tuned in my channel and subscribe guys just to honor my work here so we all share together all the source code or whatever we have learned i have learned then we can uh also share it in our channel here guys in my elections code okay so uh so far we don't have a comment from our last uh video guys because i uh immediately uh create this a new video after that so probably in the next video guys we have a shout out there just comment uh down below i will read all your comments and uh reply it and put that love and like button okay guys uh thank you so much for your support and uh so we learned together here in malik and school for those people who want to be shout out in our next video just leave a comment below guys okay don't be shy just leave a comment guys okay and then next time we will be reading that okay so thank you so much guys for watching please consider subscribing to my channel guys and press that notification bell button there guys so that you will be notified immediately when we have a new video release here for the tutorial guys here in marlin against code thank you so much for watching guys and may god bless us all thank you and bye bye stay safe everyone [Music]

Channel: Maharlikans Code

Views: 162

Keywords: go, golang web development series 31, 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, golang login authentication

Id: 3C9NjCnV0qY

Length: 30min 43sec (1843 seconds)

Published: Fri Jan 22 2021