1 00:00:01,130 --> 00:00:05,780 We've now got all four of our different primary root handlers but together we're not going to go back 2 00:00:05,780 --> 00:00:07,730 into our current user root handler. 3 00:00:07,730 --> 00:00:12,420 We're gonna take a look at some logic inside of here and start to extract it into two separate middle. 4 00:00:12,590 --> 00:00:16,740 Let me tell you exactly why we're going to do this at some point time. 5 00:00:16,760 --> 00:00:19,920 We're going to have some other services running inside of our project. 6 00:00:19,940 --> 00:00:24,890 Right now we only have all service but at some point we will also have users tickets orders whatever 7 00:00:24,890 --> 00:00:28,190 else and all these other services we put together. 8 00:00:28,320 --> 00:00:33,890 We're going to inevitably at some point in time have some incoming requests from a user who may or may 9 00:00:33,890 --> 00:00:39,530 not be logged in to things that we're almost definitely going to have to do at some point time is check 10 00:00:39,530 --> 00:00:44,810 to see whether or not that user is logged in and if they are not we are probably going to want to prevent 11 00:00:44,840 --> 00:00:47,440 access to some given root handler. 12 00:00:47,450 --> 00:00:51,620 The other thing that we are just about definitely going to have to do is take the information out of 13 00:00:51,620 --> 00:00:56,590 the Jason web token payload and set it on record current user. 14 00:00:56,780 --> 00:00:58,630 There's nothing special about wrecker user. 15 00:00:58,640 --> 00:01:00,700 This is just a very common property to use. 16 00:01:00,710 --> 00:01:05,330 Anytime that you want to present some information about the current user and get access to it inside 17 00:01:05,330 --> 00:01:07,090 of our root handler. 18 00:01:07,100 --> 00:01:11,540 So again these are two middle where's that we're just about definitely going to want to have at some 19 00:01:11,540 --> 00:01:12,360 point time. 20 00:01:12,440 --> 00:01:16,850 So we might as well create them right now as long as we are handling all this authentication stuff and 21 00:01:16,850 --> 00:01:22,290 we've got this idea of Jason Webb tokens fresh in our minds so in this video and the next one or two 22 00:01:22,620 --> 00:01:26,820 let's create these two middleware we're going to first create the middleware that's just going to extract 23 00:01:26,820 --> 00:01:32,820 information out of that payload and set it on rect current user so that it can be can be consumed by 24 00:01:32,880 --> 00:01:37,570 further handlers or Middleware is down our chain. 25 00:01:37,640 --> 00:01:40,420 So back inside my editor I'm going to find that middleware directory. 26 00:01:40,430 --> 00:01:50,850 Once again we're gonna create a new file inside their called current user dot T.S. and then inside of 27 00:01:50,850 --> 00:01:56,730 here we're going to add in one or two imports at the top and then set up the middleware function it's 28 00:01:56,800 --> 00:02:07,610 going to import requests response and the next function types from Express I'm also going to import 29 00:02:07,640 --> 00:02:13,940 JWT from Jason web token because of course we are going to want to decode our Jason what token at some 30 00:02:13,940 --> 00:02:20,310 point and we'll go ahead and export a new function called current user 31 00:02:24,640 --> 00:02:29,890 this thing is going to take some number of arguments because this is not an error handling middleware 32 00:02:29,890 --> 00:02:33,750 it's going to take three arguments of req rez in next. 33 00:02:33,780 --> 00:02:37,010 So we will put those arguments in and annotate each them as well. 34 00:02:37,480 --> 00:02:39,790 So req is of type request. 35 00:02:39,790 --> 00:02:41,920 Rez is our type response. 36 00:02:41,920 --> 00:02:45,280 And next is of type next function like so 37 00:02:48,830 --> 00:02:51,320 so inside of here what we want to do is pretty straightforward. 38 00:02:51,340 --> 00:02:56,110 We are only trying to figure out whether or not the user is logged in and if they are we want to extract 39 00:02:56,110 --> 00:03:00,100 information out of that payload and set it on rect current user. 40 00:03:00,100 --> 00:03:04,330 And again there's nothing special that that current user property it's just a very common property to 41 00:03:04,330 --> 00:03:04,690 set. 42 00:03:04,690 --> 00:03:10,540 To describe who the current user is inside an express application if the user is not logged in. 43 00:03:10,560 --> 00:03:15,630 We are not going to throw in air or anything like that that is going to be the job of the other middleware 44 00:03:15,630 --> 00:03:16,710 we are going to put together. 45 00:03:17,070 --> 00:03:21,540 So the only job this one is to say hey if you're logged in are going to extract information that payload 46 00:03:21,570 --> 00:03:24,850 and set it on this given property all right. 47 00:03:24,860 --> 00:03:30,650 So we will first put together a quick check to decide whether or not the user has a Jason web token. 48 00:03:30,650 --> 00:03:34,820 And this is going to end up being very similar to the logic we have put together back over here inside 49 00:03:34,850 --> 00:03:43,140 of our current user handler we're going to say if there is no session object. 50 00:03:43,200 --> 00:03:49,230 Remember that's why we've got that little exclamation or if there is no JWT property. 51 00:03:49,280 --> 00:03:53,090 So remember that little question mark right there is going to get typescript to kind of expand its entire 52 00:03:53,090 --> 00:03:55,130 if statement into two separate checks. 53 00:03:55,130 --> 00:04:00,380 We're going to first make sure that session is defined and if it is then we'll try to access the JWT 54 00:04:00,380 --> 00:04:08,680 property so if we do not have a session object or if JWT is not defined we want to return and move on 55 00:04:08,680 --> 00:04:15,080 to the next middleware inside of our chain so we will put inside a return next. 56 00:04:15,080 --> 00:04:15,530 Like so 57 00:04:18,830 --> 00:04:24,710 then if we get past that point we're going to want to decode the Jason web token once again very similar 58 00:04:24,710 --> 00:04:26,460 to what we did back inside of current user. 59 00:04:26,510 --> 00:04:31,250 If there's anything wrong with the decoding process we're going to probably want to make sure that we 60 00:04:31,250 --> 00:04:37,910 capture that error and send back or continue on saying oh well the user must not be logged in so I'm 61 00:04:37,910 --> 00:04:44,580 going to add in a try patch statement inside of the try. 62 00:04:44,670 --> 00:04:50,830 We'll try to get the payload out of that Jason web token to remember how we do that we call data T dot 63 00:04:50,880 --> 00:04:58,560 verify we'll pass in the Jason web token which is rec session JWT and then the second argument is going 64 00:04:58,560 --> 00:05:07,680 to be our actual token which is process envy data beauty key once again we've gone over this three times 65 00:05:07,680 --> 00:05:13,010 typescript thinks that this variable might be undefined but we already did a check for that back inside 66 00:05:13,070 --> 00:05:17,760 our indexed TSR file so we're gonna put the exclamation on there to just say hey typescript don't sweat 67 00:05:17,760 --> 00:05:21,430 it this thing is defined. 68 00:05:21,570 --> 00:05:26,910 Now if anything goes wrong with trying to extract the information then we will add end up inside of 69 00:05:26,910 --> 00:05:32,640 our catch statement so we could put in a next right here to just try to continue on but it turns out 70 00:05:32,640 --> 00:05:33,720 that no matter what. 71 00:05:33,720 --> 00:05:38,520 Whether or not this thing throws an error we really want to call next to continue on to our next middleware. 72 00:05:38,520 --> 00:05:40,860 So we don't necessarily have to put that inside the catch statement. 73 00:05:40,890 --> 00:05:47,250 Instead we can just added in right after like so as again whether or not we decode that token successfully 74 00:05:47,490 --> 00:05:56,030 we always want to continue on to the next middleware now that we've got that payload we need to actually 75 00:05:56,030 --> 00:05:57,840 set it on our request object. 76 00:05:57,920 --> 00:05:59,750 Again we are setting on the request object. 77 00:05:59,750 --> 00:06:04,730 So for their middleware is where other root handlers down this chain can figure out automatically who 78 00:06:04,730 --> 00:06:06,400 the current user is. 79 00:06:06,410 --> 00:06:11,070 So what we would like to do is wreck dot current user is payload. 80 00:06:11,450 --> 00:06:12,660 That would be ideal. 81 00:06:12,800 --> 00:06:17,660 But as soon as we do that we didn't air from typescript script to saying hey there's no current user 82 00:06:17,660 --> 00:06:20,450 property on a request object. 83 00:06:20,690 --> 00:06:25,100 So it turns out that this is gonna be just a little bit harder to do than we might have expected. 84 00:06:25,220 --> 00:06:31,710 You and I want to add in a new property to an existing object type that is already defined inside of 85 00:06:31,710 --> 00:06:33,250 you type definition file. 86 00:06:33,380 --> 00:06:38,250 As far as Tikrit script is concerned we can not just arbitrarily add in new properties. 87 00:06:38,250 --> 00:06:41,240 So we need to figure out some way to tell typescript Hey don't sweat it. 88 00:06:41,240 --> 00:06:42,130 It is OK. 89 00:06:42,140 --> 00:06:45,800 There actually is a current user property for a request object. 90 00:06:45,890 --> 00:06:49,700 We're gonna have to figure out how to work with typescript a little bit more closely and tell it that 91 00:06:49,730 --> 00:06:52,270 it is okay that we are adding in this additional property. 92 00:06:52,280 --> 00:06:54,650 Let's take a pause right here and then tackle that in just a moment.