1 00:00:08,039 --> 00:00:09,150 Welcome back. 2 00:00:09,180 --> 00:00:18,570 In this video, let's see how we can protect a root from unauthorized user, meaning that if a user 3 00:00:18,570 --> 00:00:24,750 is not logged in, we need to send a message that please log in or you are not authorized. 4 00:00:24,960 --> 00:00:33,630 So as it stands right now, we have logged in successfully, but like I said, since HTTP are stateless, 5 00:00:33,630 --> 00:00:36,860 our server does not know who has log in. 6 00:00:36,870 --> 00:00:38,100 To achieve that. 7 00:00:38,100 --> 00:00:45,780 We are going to create a murderer always to check if a user or there is a token in the browser or in 8 00:00:45,780 --> 00:00:46,470 the header. 9 00:00:46,470 --> 00:00:52,200 And then it will take that token and compare to the one that has been saved on a server. 10 00:00:52,200 --> 00:00:54,480 So let's see how you're going to create that one. 11 00:00:54,570 --> 00:01:00,390 Well, we can make it as universal, meaning that we are going to protect our route. 12 00:01:00,420 --> 00:01:06,090 Let's move in that way, and then we can refer to it to protect a specific route. 13 00:01:06,210 --> 00:01:15,210 So let's come up here before our route here and let's call this one off media where as that and we can 14 00:01:15,210 --> 00:01:18,420 get that one done using app dot use. 15 00:01:19,460 --> 00:01:27,440 We have access to wreck response and then next and for this one too, we have covered in detail in the 16 00:01:27,440 --> 00:01:28,550 previous session. 17 00:01:28,670 --> 00:01:38,660 So for this one, if I log rec dot session, let's have a look and let me run the server again. 18 00:01:38,990 --> 00:01:39,340 Good. 19 00:01:39,350 --> 00:01:47,300 So now in any of the route, if I go to homepage and you can see that we got the session being what 20 00:01:47,330 --> 00:01:47,930 console. 21 00:01:47,930 --> 00:01:48,930 Look here. 22 00:01:48,950 --> 00:01:57,770 So what we are going to do is that this middleware is going to check if there is a log in user and if 23 00:01:57,770 --> 00:02:01,610 there is no log in user, we want to display a certain template. 24 00:02:01,610 --> 00:02:07,850 So let's create one templates and call this one off or not allowed. 25 00:02:08,630 --> 00:02:14,210 So this template is just going to displace a message to the user that you need to log in. 26 00:02:14,740 --> 00:02:16,340 Okay, so let's go ahead and do that one. 27 00:02:16,340 --> 00:02:17,960 So here we go. 28 00:02:17,990 --> 00:02:22,370 Let's add H one and it says that you. 29 00:02:23,520 --> 00:02:25,140 Let's say unauthorized. 30 00:02:25,770 --> 00:02:26,970 Simple message. 31 00:02:27,910 --> 00:02:28,540 As that. 32 00:02:28,540 --> 00:02:32,170 And let's add some P tag here with some dummy text. 33 00:02:32,320 --> 00:02:35,160 So we want to display this template. 34 00:02:35,170 --> 00:02:43,660 If a user is not log in and he or she is trying to access a protected route, so now we can go ahead 35 00:02:43,660 --> 00:02:45,400 and then do that. 36 00:02:45,460 --> 00:02:56,620 So inside our middleware, this one, let's make a condition and says that if there is no rec dot session. 37 00:02:59,670 --> 00:03:01,350 Dot log in. 38 00:03:03,080 --> 00:03:06,050 User, then we want to. 39 00:03:06,870 --> 00:03:15,840 Render, rest, render, and then we render the not allowed templates going to be not allowed. 40 00:03:16,850 --> 00:03:18,100 Templates are? 41 00:03:18,170 --> 00:03:20,770 Is that so with this one, let's check it out. 42 00:03:20,780 --> 00:03:27,560 So inside our page, let's refresh the page and you can see that on authorized meaning that I have not 43 00:03:27,560 --> 00:03:33,710 log in in any of the route I visit, I will see this template called on authorize. 44 00:03:33,710 --> 00:03:35,330 So how can I look in? 45 00:03:35,330 --> 00:03:39,530 So this idea is not all that good. 46 00:03:39,530 --> 00:03:47,090 So let's go ahead and then refactor this middleware and then we are going to pass into any route of 47 00:03:47,090 --> 00:03:48,530 which we want to protect. 48 00:03:48,530 --> 00:03:50,060 So here we go. 49 00:03:50,060 --> 00:03:54,980 So let's catch the callback function from this as that. 50 00:03:54,980 --> 00:04:03,290 And next is let's create our own middleware less name this middleware as protected, which is equal 51 00:04:03,290 --> 00:04:04,850 to our callback function. 52 00:04:04,850 --> 00:04:07,370 We copy it, so that is it. 53 00:04:07,370 --> 00:04:12,350 The next step is we need to call next, otherwise it will keep hanging again. 54 00:04:12,350 --> 00:04:14,680 We have covered this one in details. 55 00:04:14,690 --> 00:04:20,480 So any route that I want to protect, I'm going to pass in this protected middleware. 56 00:04:20,480 --> 00:04:27,590 So now if I refresh the page, you can see that now I get back my form, I can go to any page because 57 00:04:27,590 --> 00:04:31,550 I'm not using the protected network. 58 00:04:31,550 --> 00:04:41,510 So now let's try to protect the profile page, which is down here, register and profile page. 59 00:04:41,510 --> 00:04:49,340 Now I want to protect the profile page as a second element to this function called good profile. 60 00:04:49,580 --> 00:04:57,200 And I also want to protect the protected route, which is this one. 61 00:04:57,200 --> 00:05:03,350 I also want to protect that as that good comma separated. 62 00:05:03,350 --> 00:05:04,220 Perfect. 63 00:05:04,520 --> 00:05:11,000 So now on this template core protected, I don't need to check or make any conditions here, so I want 64 00:05:11,000 --> 00:05:14,270 to remove this one from the previous video. 65 00:05:14,690 --> 00:05:16,580 I don't want to make any condition. 66 00:05:16,580 --> 00:05:20,330 I just want to say that welcome to your protected page. 67 00:05:20,330 --> 00:05:23,000 Let's say bravo. 68 00:05:23,150 --> 00:05:24,440 Hey, hey, hey. 69 00:05:24,440 --> 00:05:27,710 All right, so now let's have a look. 70 00:05:27,920 --> 00:05:34,520 If I go to the page now, if I refresh it and go to home, I go to log in, I can navigate. 71 00:05:34,520 --> 00:05:39,410 But as soon as I click on Protected where something is not working well. 72 00:05:39,410 --> 00:05:43,400 So let's check the terminal and see where I went wrong. 73 00:05:44,510 --> 00:05:46,400 There is something wrong here. 74 00:05:46,430 --> 00:05:51,710 It says that it cannot send headers after it has been sent. 75 00:05:51,740 --> 00:05:52,780 Well, I got it. 76 00:05:52,790 --> 00:05:57,260 The problem must be from our middleware function here. 77 00:05:57,680 --> 00:06:05,900 Let me collapse this one little bit and let's locate our middleware function, which is this one we 78 00:06:05,900 --> 00:06:07,280 need to return. 79 00:06:07,520 --> 00:06:08,000 Yes. 80 00:06:08,000 --> 00:06:09,890 From this middleware function. 81 00:06:10,010 --> 00:06:10,490 All right. 82 00:06:10,490 --> 00:06:11,960 So now let's check it out. 83 00:06:12,230 --> 00:06:15,800 And the server has restarted and let's refresh it. 84 00:06:15,800 --> 00:06:16,940 Let's go to home. 85 00:06:17,060 --> 00:06:21,320 Home page is working, login is working, register and protected. 86 00:06:21,320 --> 00:06:28,220 And we have the unauthorized page, meaning you need to log in and we can add a button down here to 87 00:06:28,220 --> 00:06:29,510 go to log in. 88 00:06:29,510 --> 00:06:31,450 So let's do that one quickly. 89 00:06:31,460 --> 00:06:38,450 So inside the not authorized page, let's add this one. 90 00:06:38,450 --> 00:06:39,560 Let's add. 91 00:06:40,350 --> 00:06:42,480 A link and cord is one. 92 00:06:42,480 --> 00:06:45,900 Log in the path and log in. 93 00:06:46,080 --> 00:06:47,400 So let's see. 94 00:06:47,580 --> 00:06:49,080 Let's refresh it. 95 00:06:49,080 --> 00:06:49,830 And now I see. 96 00:06:49,830 --> 00:06:50,300 Log in. 97 00:06:50,310 --> 00:06:52,650 Let me click on that and go to. 98 00:06:54,270 --> 00:06:55,270 Look in here. 99 00:06:55,290 --> 00:06:56,910 One, two, three, four, five. 100 00:06:56,910 --> 00:06:58,000 And look in. 101 00:06:58,050 --> 00:07:00,420 Now, I have looked in. 102 00:07:00,660 --> 00:07:01,370 That is it. 103 00:07:01,380 --> 00:07:02,830 If I go to protect it. 104 00:07:02,850 --> 00:07:05,430 Now, welcome to your protected. 105 00:07:05,460 --> 00:07:08,220 But, guys, one caveat then. 106 00:07:08,610 --> 00:07:12,750 As soon as I restart my server. 107 00:07:14,980 --> 00:07:18,550 Let's see what's going to happen when I refresh it. 108 00:07:18,550 --> 00:07:23,610 If we see that not authorized, that is why we make mention that. 109 00:07:23,620 --> 00:07:27,250 Let's go to point number five. 110 00:07:27,790 --> 00:07:29,470 Yeah, last point here. 111 00:07:29,500 --> 00:07:37,180 It says that when a user logs out or the server destroys the search in the cookies and indeed that is 112 00:07:37,180 --> 00:07:38,890 why it has been declared. 113 00:07:38,890 --> 00:07:46,090 So we need a way to pass this the session and we'll get into that in the next video or the upcoming 114 00:07:46,090 --> 00:07:46,440 ones. 115 00:07:46,450 --> 00:07:47,320 The next video. 116 00:07:47,320 --> 00:07:51,340 Let's implement how we can log out a user.