Laravel vuejsLaravel Passport Scope Based Auth Setting our Vuex or StorePart 82020


Softgear Technology


laravel,vue,vuejs,vuex,router,laravelpassport,auth,laravel store,laravel vuex,laravel tutorial,laravel 6,laravel vue spa,laravel vue project,laravel store file,vuetify,step by step laravel tutorial,complete course laravel,beginner,full course for beginner,laravel from scratch,laravel framework,laravel in 30 mintue,laravel admin panel,laravel login system,api laravel,crud

okay sorry I was busy and I'm making this tutorial very late let's do something nice today like some basic things first of all we will have the display our username here the login username you and after that we will have to make two pages and set the basic system and our front-end so like who will be able to access which page of which link and who will be able to access another because we will have to modify our token scope pass system - some kind of rules like we will have to add to hold our two scopes one will be the administrator and the second will be the user so then we can operate many roles like that okay so let's start here we have two terminals - what a lot of L server PHP server and the second one has run watch command so here first of all every look tour Jason did components and then the nail bar sorry header here you see we have this starter strip but I here I want to display a username okay so what we will have to do here inside our wheels and then no not sorry if we looked over store we have to store the data inside our state ok so we will call it profile and it should be like this empty bone okay and here we will need to hear something like locked in some kind of X or Y to call it should be false or love anything you can give it so this will be our check we can directly access this because as we know that the store is used to have a variables or a data that can be accessed from any component or any view file so you can exit access this kind this data from here so that's why the store of our use okay so now we have to insert data to this profile for this we will have to go to your F dot view and here I will help some kind of API request to bring the user data one more thing I must tell you that you can get the data from the token like and here we have and settle application so here we have all the data we to code this token using agent JWT and we can get all the user data like name and email and all those stuffs but as for example and future if you want to to update the user profile and you have a functionality to edit a user information and the user click on that and just update health information like first name you want to change or something like that then their data well you will have to log out that user and then log and peg okay do you get from the database because this always told the old data so for that we have we cannot use this is a potato from this so that's why we need to have some kind of API call on the page load to bring the user new data from the database and and store it to the data stored it into the vivix I mean the store of the movie yes okay so here so for that we will need to have API call here before writing or method here we will need to have also the the route for date so let's create a route and set our API dot PHP so it will be a get request and we can say something like you say ok you 0 and then profile we don't need this user here we'll have to go to a party controller so just copy paste and well hit up a while method but we don't have this profile method inside of our controller so we have to create that right now we will scroll down and here we can create that method you okay this look great now let's go here we can do this later let's have some find out to do here and but before they're to be able to do some work here like first of all we will need to help authenticate or any method you can find here and it will take the state and then the payload and stop all we have to check we have to kill a very tall as large and variable here so we can use all every check here we inside your odd service we have as logged in here so we need to just import or awesome this here sorry so this is our service and we have to call a locked end because if the user is logged and then a local storage is in this item then it will return the token otherwise it will return now so this will be good if we make it now by default so if now if the state that is login it is not now then we have to give to pass the bellow to this profile okay and the payload is here this one and otherwise we have to make a 20 and inside actions to call it so 30k and then let's say it will take context and parent you with the help of context we can commit that indicate they stand here and can't pass the payload we will get from whenever we are dispatching this so we will also pass the payload and it will pass this battle here and this will insert to the propriety okay so this is fine now let's come back to our service and here we need to dispatch dead dead but we will need to important role here stroke stroke I think you have to go one for to beg and then straw and here we will have to call that likes to talk dispatch and it is this one and we're gonna have to cross the use of title user okay because this user object content because this is response or data and just was in response to our data contain many things like token and also the user object so we have to care take that user object and pass to the authenticate okay and when it is passed here it will take as payload and then it will pass 2 here and here we are passing it okay so now let's test this so here first of all we will need to log out and now my captor HTML country okay now to check this we will need to go to a header and here we can get the profile the complete objects here just test this this we will have we will have nothing because we are not calling that unreal also just an empty object okay and if we log out and again try to log in three and you see we have the complete data here so we will need just to get the name so name okay and also we can look at this is fine but if I save this and if I reload again I will have nothing here here so let's logout again and then Mike into achievement calm like 1 2 3 and now we have myk's myk's step here but we Fe again let's reload this you will have nothing here so now let's come back to your fw to fix this so it's a notice to do here let's give it a name also and before create middleware and it should be a saying because we are a PA call here I forgot to write as here okay people create then we hope to use a try/catch here and first of all we will have to check if our dot is up then then to call it like constant response equal to and then I wait I'll get profile okay and be able to find this method we don't have this right now and then we have to in this page again the same thing like we did in our service testing so let's copy this and in here sorry here you will have to use it but instead of please use a turtle we have to something like use something response update attack dated a cancer let's control this to check it would be hell inside of his mom's let's copy this and I said oh all service it's all gendalago didn't get here we will divide method and here we will need to heaven at the API call to reach an HTTP direct and auth and then this is fine now let's reload you okay we are getting this data so inside response we need to pass the data so this is right okay here you see we have no mic step once we reloading once we did all this we all just have this microchip here okay so this is fine now if for example we have some air or something like that we can just call the logout method now don't the user so this is fine like this if you reload we have this so here if you see now let's check out that our best okay if you look here we have the user's table and said this we have roll author any administrator okay but I just want to change as administrative message it should be administrator this one but this one I want to have a user so I will have to update all here and also inside our migration so let's come here and database and the migration and then the user table the pie T partial user now one more thing we had to do as I said we have to modify the token scopes little bit so inside your providers and then service provider here instead of do anything and can create we can just give it a like it made a stretcher and a user okay use of all you can say scope or something took on scope this is just description you can use anything I'll use this okay and same is true for this one okay this is fine now let's lip read but okay one more thing we hope you do inside out HTTP and then all service or controller whenever we are creating a scopes then we have to change these also okay so there should be let's copy this authors provider like administrator and then Pixar okay so this is fine let's save this okay close all these now let's do further on in the next tutorial