Django & React JWT Authentication Part 4 - Testing API Endpoints

how's it going guys welcome back in this section we are going to finish up with the configuration here for Djoser and then we're gonna actually test out these API requests with postman and see if everything works so first thing I'm gonna do is in this accounts app I'm gonna create a new file here called serializers dot pi let's make sure I spelt that right because I always end up butchering the spelling I think it looks good we'll find out ok and then I'm gonna do from Djoser dot serializers what I'm gonna do is I'm gonna import user create serializer and we're basically gonna overwrite this serializer that I'm also gonna need from rest underscore framework actually no I won't need serializers from rest underscore framework now that I think about it what I will need is from Django contrib dot auth I'm going to need to import get user model and then I'm gonna have to actually grab that user model so user is equal to get user model so when we have a custom user model this is how we retrieve it and then within here I'm gonna create the serializers class user create serializer we're gonna pass in user create serializer in here I'm gonna do class Mehta I'm gonna pass in user create serializer dot Mehta and then the model it's gonna be user and then the fields are gonna be ID email name and password and that's it so that's how we create the serializer or I guess how we override it and now back in our settings what we're gonna want to do is we're gonna do user underscore create I'm gonna do accounts duct serializers and we're gonna do is I'm just gonna copy this word serializer so I don't mess up the spelling because I always mess up the spelling of this so serializers dot user create serializer actually all I can do is I'm gonna just copy this down two more times I'm gonna need a user and I'm gonna need user underscore delete and then this is actually gonna come from Djoser dot serializers dot user delete serializer okay so user is gonna be using that user create serializer it's gonna be the exact same and then user create it's gonna also be using that user create serializer alright so there we go that's our back-end all complete so now let's go ahead and test this out so here I have postman open now what we're gonna want to do I'm actually gonna kind of reconfigure this a little have this right here nice and handy and then you're gonna want to go into the Djoser documentation go to the base endpoints and here we're gonna have the different endpoints we're gonna want to reach out to so I guess the first one is going to be a post request here we're creating a user so let's make this a post request it's gonna be HTTP colon slash slash localhost 8080 slash users slash but the well it's slash users slash but one thing you want to make sure is that you actually do if we go back into our code and we open up our root URLs we have this off here so make sure that you have off so auth slash user slash will be the actual end point here that we're making so make sure you have that and now what are some fields we have to pass in so of course we have our username and then any other required fields then password and re password so let's go ahead and do that so in our headers we're gonna have to pass in content type it's gonna be application Jason and then in the body we're gonna pass in some raw data we're gonna have email we're gonna have the name we're gonna have password and we're gonna have repast word alright so let's go ahead and do these so I'm just gonna go into my settings here and grab my email here just I don't mess up the email spelling just paste that in there name is gonna be John Doe and let's set up a password so let's see what would be a good password my awesome password one two three all right so we'll pass this in and we'll try to now create a user so let's make this request see if it works and it's not gonna work because I'm not running my pack hint so let's do that quickly so I run the server and let's see of course I messed this up okay post gray SQL where is that and what else did I mess up hosts grass ql isn't an available database back-end and that of course is because again i did not spell this right so let's try this again host grey SQL okay so now we have a different issue here so value air so dependency on app migrations accounts of course we have to do Python managed PI make migrations Python managed PI migrate and now let's run the server there we go so now I thought that we can go back here and actually send that API request so we got a tie pair why did we get a type error all right so I think what the issue is if we go back into our settings because this here is a couple and there's only one value I think I need to have a comma here so I have a comma here but this also wasn't a couple so that's fine but yeah here I believe I needed a common that's what was going on there so let's go back here send that request again so settings object has no attribute activation URL and that's because I spelled this wrong activation URL that's fixed that's send this request again and there we go user account with this email already exists oh my okay so what I'm gonna do is I'm just gonna do Python manage PI flush just to remove that from database I could actually create it properly here now let's go ahead and run this and there we go so name John Doe email and ID and now we should get an email there it is you're receiving this email because you need to finish activation process alright and actually something I want to do instead of having it being sent to myself I'm gonna log in to the other dummy email I created so here's that other dummy email I have let's just remove some of these things here this was from before let me delete that and I'm gonna be using this email instead so this one let's create that so there we go we created this user John Doe with this email and now let's just go ahead and save this so this is gonna be user creates alright so now we can create a user let's test out some other stuff here and we also should have received an email and there it is so here's our activation URL so localhost 8080 so of course once we have our front end set up once you click this it'll navigate to our front end where we're gonna have a button verify and then when we click that button verify what we're gonna do is we are going to make a request to this URL so now this is the next thing we're gonna do so we're gonna set up a URL in order to actually activate our account so a localhost 8000 activation so it's gonna be a poster quest we're gonna pass in the UID and the token so poster quest headers content type application Jason and then we're gonna pass in raw data here we're gonna pass in the UID and the token and now we actually have access to this UID and token because they are right here so I'm just gonna go ahead and grab this mg put that right in here and of course we're getting this err because our build template doesn't currently exist so we can't actually navigate to this URL but that's fine all we really need are these fields here I'm gonna grab that space that right in here as the token and I'm gonna send this request to our back-end alright so let's see if that works we should get an activation confirmation your account has been successfully created and activated awesome so our account is activated now let's try to log in to our account alright so to actually log in to our account we're gonna do these JWT endpoints and our login will be to this endpoint request here so first of all let's go ahead and save this as user account verification I guess and of course that is spelled wrong because my keyboard is absolutely busted there you go now let's make a request to localhost 8080 create now this is gonna be a post request we're gonna pass in the username which is our email and then password and now why is it username because we have this username field attributes and if we go to our custom user model our username field attributes is email so that's why we're using email in case if you're wondering so email password so post request we're gonna make the headers content type application Jason sent some raw data and then that's gonna be email and password so I'm gonna go ahead go to this user create just grab this email paste that right in here and then grab our wonderful password here and let's test this out I'm gonna send her a quest and we should get an access and refresh token and we do so we get our refresh token and we get our access token which now you can actually use in order to authorize different API routes now in this I guess project I'm not actually having any views where you have to be like authorized and stuff but it's very simple to do just pass an authorization header you're gonna do JWT space this token and that'll be your authorization route so actually that might be something I add into this project just to show at the end I'll see but it might be good to actually have that included and then of course we can test even this route out so localhost 8080 UT refresh let's go ahead and copy some of this stuff so I don't have to type it an application jason and then in our body we're gonna pass this refresh attribute and then we're going to pass our refresh token and then that should give us access to a new refresh token so let's go ahead send that method get not allowed of course has to be a post request and there we go we get a new access token so that's how this refresh your out works so let's save these two routes this one is going to be I guess get Jason web tokens because it's the access and refresh tokens and then this can be like gets new access token there's something so I'll save those alright so what are some other things we want to do so let's go back to our base and points so we have user create user activates you can do user delete even let's see what are some things we want to do so we want to do reset password that's one of things here right so we are going to send a request to this so let's go ahead and do that that is going to be a post request where we pass in our email field so post request localhost 8000 users resets password and then we're gonna have again content type application Jason and a pass in raw data we're gonna pass in our email and then let's go here grab this email copy and paste that and here send a request there we go now we should get an email so password reset on localhost to 8009 get this URL here which once we have our front end of course when we click this our reacts is gonna handle this URL and give us a page where we can reset our password so now we can go ahead and click this of course we're getting this whole nasty error again because we don't have our build template yet and our back-end is trying to look for it so we will have this later and this won't be something that's present later on but right now all I need is to grab this here so basically where is it so once we do our password reset confirmation I'm gonna have to pass in the UID and the token and let me just go and check something real quick so this right here isn't actually good this should be a slash not a comma I don't know why I didn't notice that so it's kind of noticing this URLs a little messed up here so this comma should be a slash so that's gonna be fixed now so I'm just gonna need to grab this UID so let's make a new post request here you're gonna have content type application Jason in the body I'm gonna have UID I'm gonna pass that in I'm gonna have token the token is gonna be this right here and grab that to paste that in here and let's see what else we need so base endpoints we need new password and renew passwords so so new password and renew password so let's set a new password this incredible password three-two-one so we're gonna grab that and we're gonna attempt now to actually reset this password of course you have to pass in HTTP localhost 8080 I or API endpoint which is users reset password confirm so let's send our API request here 403 forbidden I'm gonna make another request here and let's see if my endpoint is good oh it was forbidden because I didn't have this slash at the end so let's put that slash let's send the request okay now it should have worked so if I go back your password has been successfully changed so now let's go ahead and confirm that that's happened and before I do that I'm just gonna save these two so request new password and then this one's going to be reset password okay so if we go into our log in here so right now what we have in our body is our old password so if we go ahead and try to get an access token no active account found with the given credentials so of course we're gonna have to pass in our new password that we set up so let's go test that out paste this in here send the request and now we get our refresh and access token so there we go so resetting the password worked alright so now we have our back-end fully set up we tested every all the routes that we're gonna you and of course there's many other routes in here that you can also use which is pretty cool so you can do like reset username so you would do reset username you would again to a post request to this route you would get a link where you'd have your UID and token which are then you could pass into this and reset your username which in our case is like the email so there's like other things you can do here you can expand further but of course this what I did so far should kind of give you the foundation to actually be able to go ahead and implement more of these things so I hope you enjoyed the section where we ended up completing the backend setup today fixing some of the little issues we had and actually testing all these endpoints and making sure they work and now that our back-end is fully functional now we can go ahead in the next section and set up our react front-end and actually utilize this pretty cool authentication system so hope you enjoyed please leave a like and subscribe to the channel if you're enjoying this content and I'll see you in the next section thank you

Channel: Bryan Dunn - Web Development Videos

Views: 9,413

Rating: 4.9636364 out of 5

Keywords: 2020-04-22, web development, web application, website, app, application, development, software development, engineering, software, mobile app development, mobile apps, website development, full stack, full stack development, python, django, react, redux, postgres, postgresql, SASS, postman, REST, REST API, API

Id: lFD5uoCcvSA

Length: 21min 20sec (1280 seconds)

Published: Tue Jul 07 2020