1 00:00:03,680 --> 00:00:08,435 Now that we understand about cookies and express sessions, 2 00:00:08,435 --> 00:00:11,895 in this exercise, let's look at cookies in particular. 3 00:00:11,895 --> 00:00:15,490 We will see how we can use the cookie-parser middleware 4 00:00:15,490 --> 00:00:22,185 to set up and handle cookies within our express application. 5 00:00:22,185 --> 00:00:26,900 Going back to our ConFusion Server Express application 6 00:00:26,900 --> 00:00:28,695 that we have been working on so far, 7 00:00:28,695 --> 00:00:32,420 you will notice at the top that the cookie-parser is 8 00:00:32,420 --> 00:00:37,200 already included in our express application. 9 00:00:37,200 --> 00:00:40,150 If you need to explicitly install cookie-parser, 10 00:00:40,150 --> 00:00:45,230 you just need to type "npm install cookie-parser minus minus save." 11 00:00:45,230 --> 00:00:48,740 But since our Express Generator has already included 12 00:00:48,740 --> 00:00:52,810 the cookie-parser into our express application that we scaffolded out, 13 00:00:52,810 --> 00:00:56,210 we don't need to do that step in this exercise. 14 00:00:56,210 --> 00:00:59,430 So, you see that the cookie-parser is already included there, 15 00:00:59,430 --> 00:01:03,910 and then if you scroll down, 16 00:01:03,910 --> 00:01:08,290 you would see that in the code right below here, 17 00:01:08,290 --> 00:01:13,925 you would see the cookie-parser has already been included into the middleware there. 18 00:01:13,925 --> 00:01:16,330 Now, for this cookie-parser, 19 00:01:16,330 --> 00:01:19,885 we will be using signed cookies in this exercise. 20 00:01:19,885 --> 00:01:21,680 So, for this cookie-parser, 21 00:01:21,680 --> 00:01:27,580 I'm going to supply a secret key as the parameter here. 22 00:01:27,580 --> 00:01:29,990 The secret key could be any string there, 23 00:01:29,990 --> 00:01:37,450 so I'm just going to supply a string like this, I'll say 12345-67890. 24 00:01:37,450 --> 00:01:39,915 It doesn't have to be anything meaningful, 25 00:01:39,915 --> 00:01:48,650 it's just a key that can be used by 26 00:01:48,650 --> 00:01:53,160 our cookie-parser in order to encrypt 27 00:01:53,160 --> 00:01:59,560 the information and sign the cookie that is sent from the server to the client. 28 00:01:59,560 --> 00:02:05,775 So, once we set up our cookie-parser to handle signed cookies, 29 00:02:05,775 --> 00:02:08,805 so then within the authorization itself, 30 00:02:08,805 --> 00:02:13,555 so you see that we have the authorization that we have built in here. 31 00:02:13,555 --> 00:02:15,130 Now, within the authorization, 32 00:02:15,130 --> 00:02:16,735 what we're going to do is, 33 00:02:16,735 --> 00:02:23,385 the first time that the user tries to access the server, 34 00:02:23,385 --> 00:02:29,870 we will expect the user to authorize himself or herself. 35 00:02:29,870 --> 00:02:37,360 Thereafter, we will set up the cookie on the client side from the server and 36 00:02:37,360 --> 00:02:41,350 then subsequently the client doesn't have to 37 00:02:41,350 --> 00:02:45,420 explicitly keep sending the basic authentication information. 38 00:02:45,420 --> 00:02:53,335 Instead, the client will simply need to include the cookie in the outgoing request. 39 00:02:53,335 --> 00:02:56,650 Since we are using signed cookies here, so, 40 00:02:56,650 --> 00:03:01,010 when the incoming request comes in, 41 00:03:01,010 --> 00:03:04,490 so we will handle that inside the authorization. 42 00:03:04,490 --> 00:03:08,885 Now, you recall that we have already set up the authorization middleware here. 43 00:03:08,885 --> 00:03:12,980 So, we're going to modify this authorization middleware to make use of 44 00:03:12,980 --> 00:03:17,445 cookies instead of the authorization header. 45 00:03:17,445 --> 00:03:20,910 So, what we will do here is that, 46 00:03:20,910 --> 00:03:24,710 we'll say "console.log" and then we will, 47 00:03:30,340 --> 00:03:33,140 "console.log(req.signedCookies)" so that we see what is actually 48 00:03:33,140 --> 00:03:35,790 included in the signed cookie here. 49 00:03:35,790 --> 00:03:38,070 Now, also after this, 50 00:03:38,070 --> 00:03:46,275 what we will do is we'll say, "If (!req.signedCookies.user)". 51 00:03:46,275 --> 00:03:51,635 User will be a property that we will set up 52 00:03:51,635 --> 00:03:54,440 in the signed cookie as you will see a 53 00:03:54,440 --> 00:03:57,520 little bit later how we will setup the signed cookie. 54 00:03:57,520 --> 00:04:05,600 So, if the incoming request does not include the user field in the signed cookies, 55 00:04:05,600 --> 00:04:09,640 and then that means that the user has not been authorized yet. 56 00:04:09,640 --> 00:04:11,990 So in that case, 57 00:04:11,990 --> 00:04:18,195 what we will do is expect the user to authenticate himself. 58 00:04:18,195 --> 00:04:23,740 So, then, we will do all this part here. 59 00:04:23,740 --> 00:04:27,890 So notice that we had already done this 60 00:04:27,890 --> 00:04:32,105 earlier where we were handling the authentication header. 61 00:04:32,105 --> 00:04:34,630 So we will take all this part, 62 00:04:34,630 --> 00:04:41,805 all the way up to this "else" here and then include that inside here. 63 00:04:41,805 --> 00:04:48,260 So essentially, what we are specifying here is that, 64 00:04:49,110 --> 00:04:51,750 let me indent it. 65 00:04:51,750 --> 00:04:55,100 As you see, I am very particular about my indentation 66 00:04:55,100 --> 00:04:59,005 because that keeps the code more easier to read. 67 00:04:59,005 --> 00:05:00,740 So inside this if, 68 00:05:00,740 --> 00:05:04,990 so this is the closing point of the if of this one here. 69 00:05:04,990 --> 00:05:11,600 So we are saying if the signed cookie doesn't contain the user property on it, 70 00:05:11,600 --> 00:05:17,960 then we expect the user to authorize by including the authorization header. 71 00:05:17,960 --> 00:05:20,090 So we'll look for the authorization header. 72 00:05:20,090 --> 00:05:22,760 If the authorization header is not available, 73 00:05:22,760 --> 00:05:28,190 then we will simply reject the user and prompt 74 00:05:28,190 --> 00:05:34,120 the user to enter the username and password as we did in the previous exercise. 75 00:05:34,120 --> 00:05:36,600 If the authorization header is included, 76 00:05:36,600 --> 00:05:41,165 then we will process the authorization header just like we did before, 77 00:05:41,165 --> 00:05:44,565 and if the user is an authorized user, 78 00:05:44,565 --> 00:05:49,620 recall that we called the next to let the user proceed forward. 79 00:05:49,620 --> 00:05:51,480 Now at this point, 80 00:05:51,480 --> 00:05:56,685 what we will be doing is that we will say, 81 00:05:56,685 --> 00:06:00,380 we will set up the cookie at this point. 82 00:06:00,380 --> 00:06:04,725 So this is where we will use the res cookie here. 83 00:06:04,725 --> 00:06:07,880 Notice that the cookie doesn't exist, 84 00:06:07,880 --> 00:06:10,125 so we'll say "res.cookie." 85 00:06:10,125 --> 00:06:15,275 As you can see, the res cookie itself takes the first value name string, 86 00:06:15,275 --> 00:06:19,060 value string and options, cookie options. 87 00:06:19,060 --> 00:06:25,820 Set the cookie name to value with the given options and the options are included here, 88 00:06:25,820 --> 00:06:27,410 some options for the cookie here. 89 00:06:27,410 --> 00:06:31,040 I'm going to simply use a few of the options here. 90 00:06:31,040 --> 00:06:37,500 So we'll say, "res.cookie" and then I'm going to set up the cookie with the name user. 91 00:06:37,680 --> 00:06:41,890 Now notice that this is the reason why I am 92 00:06:41,890 --> 00:06:45,400 checking for the req.signedCookies.user up there. 93 00:06:45,400 --> 00:06:51,380 So we'll say "res.cookie('user',)" and 94 00:06:51,380 --> 00:06:56,290 the user field I will set it to 'admin' and 95 00:06:56,290 --> 00:07:01,390 then I will set this up to be a signed cookie. 96 00:07:01,390 --> 00:07:03,725 So I will say "signed: true." 97 00:07:03,725 --> 00:07:06,295 So which means that my cookie-parser will ensure 98 00:07:06,295 --> 00:07:10,120 that this cookie will be signed and setup. 99 00:07:10,120 --> 00:07:14,290 So this is the option that I set up for the res cookie here. 100 00:07:14,290 --> 00:07:16,360 So this will include 101 00:07:16,360 --> 00:07:22,300 this particular name into the signed cookie with this particular value. 102 00:07:22,300 --> 00:07:26,160 So that is the reason why I'm able to check that value up here. 103 00:07:26,160 --> 00:07:27,770 So if this doesn't exist, 104 00:07:27,770 --> 00:07:33,620 then of course I expect the user to authenticate by using the basic authentication, 105 00:07:33,620 --> 00:07:36,045 and if the basic authentication is successful, 106 00:07:36,045 --> 00:07:40,190 then I will set up the cookie here and set up 107 00:07:40,190 --> 00:07:45,440 the cookie field in the outgoing response message here and 108 00:07:45,440 --> 00:07:49,730 this will prompt the client to set up the cookie on the client side and then 109 00:07:49,730 --> 00:07:55,055 all subsequent requests will include this cookie in the client request. 110 00:07:55,055 --> 00:08:02,085 So that is how I am handling the fact when the cookie.user doesn't exist. 111 00:08:02,085 --> 00:08:05,120 There. If it exists, 112 00:08:05,120 --> 00:08:07,765 then the else part, 113 00:08:07,765 --> 00:08:11,155 so that means that the signed cookie already 114 00:08:11,155 --> 00:08:16,415 exists and the user property is defined on that, 115 00:08:16,415 --> 00:08:18,255 then in the else, 116 00:08:18,255 --> 00:08:19,810 what I will check is 117 00:08:19,810 --> 00:08:33,150 if req.signedCookies.user is admin. 118 00:08:33,150 --> 00:08:37,380 Then, that means that the signed cookie contains the correct information. 119 00:08:37,380 --> 00:08:39,780 Then, I will say next. 120 00:08:39,780 --> 00:08:44,800 So which means that you will allow the request to pass through. 121 00:08:46,520 --> 00:08:55,250 Otherwise, this cookie is not valid because it doesn't contain this correct value. 122 00:08:55,250 --> 00:08:57,635 So that means that this is an error. 123 00:08:57,635 --> 00:08:59,749 So in this case, 124 00:08:59,749 --> 00:09:02,750 we will say you're not authenticated, 125 00:09:02,750 --> 00:09:12,075 and then we will simply cause the error in this point. 126 00:09:12,075 --> 00:09:15,640 Now, we're not going to prompt the user for 127 00:09:15,640 --> 00:09:18,585 the session because that must have been done earlier. 128 00:09:18,585 --> 00:09:20,870 Now, normally, this would not happen 129 00:09:20,870 --> 00:09:24,470 because if the cookie is already set on the client side, 130 00:09:24,470 --> 00:09:27,005 then it must include the correct value anyway. 131 00:09:27,005 --> 00:09:29,850 But for the sake of completeness, 132 00:09:29,850 --> 00:09:35,315 I have also included the else error check here at this point. That's it. 133 00:09:35,315 --> 00:09:38,210 With this setup, we have turned 134 00:09:38,210 --> 00:09:43,710 our express application into one that handles cookies here. 135 00:09:43,710 --> 00:09:48,405 Note again, let me draw your attention to what we're doing here one more time. 136 00:09:48,405 --> 00:09:50,060 Here, we are checking to make sure 137 00:09:50,060 --> 00:09:54,970 that user property in the signed cookies doesn't exist, 138 00:09:54,970 --> 00:09:57,380 or even the signed cookie itself doesn't exist. 139 00:09:57,380 --> 00:10:02,595 Then, we will expect basic authorization to be done. 140 00:10:02,595 --> 00:10:04,850 If the authorization is successful, 141 00:10:04,850 --> 00:10:09,860 then I am going to set up the cookie by using the res.cookie here. 142 00:10:09,860 --> 00:10:14,035 Then, all subsequent requests will carry the signed cookie anyway, 143 00:10:14,035 --> 00:10:17,080 and then so I'll check to see that the signed cookie is 144 00:10:17,080 --> 00:10:22,905 a valid signed cookie and contains the user property which is set equal to admin. 145 00:10:22,905 --> 00:10:25,680 If it does, then this is an authorized access, 146 00:10:25,680 --> 00:10:27,935 so it'll allow to proceed forward. 147 00:10:27,935 --> 00:10:31,920 If not, then I raise an error at this point. 148 00:10:31,920 --> 00:10:39,710 Minor correction, the new versions of Node.js expect you to use this as 149 00:10:39,710 --> 00:10:47,500 new Buffer.from instead of new Buffer in order to deal with some security issues. 150 00:10:47,500 --> 00:10:53,165 So just correct this line to new Buffer.from. That's it. 151 00:10:53,165 --> 00:10:59,600 Let's save the changes and then go and look at our application in that Postman. 152 00:10:59,600 --> 00:11:03,310 If the previous server is running, 153 00:11:03,310 --> 00:11:06,155 just stop it by typing Control C, 154 00:11:06,155 --> 00:11:09,665 and then restart the server by saying npm start. 155 00:11:09,665 --> 00:11:13,305 Of course, make sure that your MongoDB server is up and running. 156 00:11:13,305 --> 00:11:17,140 Otherwise, your express server will not start correctly. 157 00:11:17,140 --> 00:11:19,955 So once your express server is started, 158 00:11:19,955 --> 00:11:26,250 then let's go to our Postman and try to connect to the server. 159 00:11:26,250 --> 00:11:30,970 And I'll demonstrate a few aspects about how cookies are handled. 160 00:11:30,970 --> 00:11:32,939 Now, going to Postman, 161 00:11:32,939 --> 00:11:35,980 let me clear out all this information 162 00:11:35,980 --> 00:11:40,745 from my Postman and then we'll start with the basics. 163 00:11:40,745 --> 00:11:44,265 So let me try to access the localhost:3000/dishes. 164 00:11:44,265 --> 00:11:47,335 Now, after I have cleared everything, 165 00:11:47,335 --> 00:11:49,460 I'll send the request and save. 166 00:11:49,460 --> 00:11:51,150 And so from the server side, 167 00:11:51,150 --> 00:11:53,600 it says you're not authenticated. 168 00:11:53,600 --> 00:11:55,365 Then, when you look at the header, 169 00:11:55,365 --> 00:12:00,350 this is asking me to authenticate using the WWW-Authenticate. 170 00:12:00,350 --> 00:12:05,115 So now, let me go into the authorization and then set up the basic authorization, 171 00:12:05,115 --> 00:12:08,415 and then I'll set up the authorization as admin, 172 00:12:08,415 --> 00:12:14,200 and then password, and then update the request so that the header 173 00:12:14,200 --> 00:12:20,090 will now contain the authorization header here with the information there. 174 00:12:20,090 --> 00:12:23,900 And then let me send the Git request on this part. 175 00:12:23,900 --> 00:12:25,805 If I send the Git request, 176 00:12:25,805 --> 00:12:34,205 then in response, you see that the Git request was successful. 177 00:12:34,205 --> 00:12:38,300 Note also a few more things. 178 00:12:38,300 --> 00:12:41,060 You'll see the status is 200 OK. 179 00:12:41,060 --> 00:12:50,805 Note also that a cookie has been set up on our client side in within Postman here. 180 00:12:50,805 --> 00:12:53,120 This cookie contains information. 181 00:12:53,120 --> 00:12:55,420 We'll look at the details of the cookie in a minute. 182 00:12:55,420 --> 00:12:57,265 Then, when you look at the header, 183 00:12:57,265 --> 00:13:03,130 you see in the header this value here saying Set-Cookie, 184 00:13:03,130 --> 00:13:06,165 and then this information that comes in here. 185 00:13:06,165 --> 00:13:10,290 Now, if you look at it carefully, 186 00:13:10,290 --> 00:13:13,965 you'll see something here says user equal to, 187 00:13:13,965 --> 00:13:18,000 and then you see this value here, admin there. 188 00:13:18,000 --> 00:13:23,845 So, you notice that something has been enclosed inside the cookie. 189 00:13:23,845 --> 00:13:26,465 If you want to actually examine the cookie, 190 00:13:26,465 --> 00:13:30,355 go up here in Postman and then click on these keys, 191 00:13:30,355 --> 00:13:37,205 and then this will show you all the cookies that have been set up on this client side. 192 00:13:37,205 --> 00:13:43,365 Then, in particular, now let me clear out all these other cookies. 193 00:13:43,365 --> 00:13:48,640 I probably have used some of these for some other reason. 194 00:13:48,640 --> 00:13:51,290 So let me just clean out those cookies. 195 00:13:51,290 --> 00:13:53,020 Anyway, if you see them, 196 00:13:53,020 --> 00:13:54,355 you can just leave them there. 197 00:13:54,355 --> 00:13:56,385 Not a big problem. 198 00:13:56,385 --> 00:14:00,220 Concentrate specifically on the local host here, 199 00:14:00,220 --> 00:14:02,620 and then you see this cookie here. 200 00:14:02,620 --> 00:14:03,780 Just click on the cookie, 201 00:14:03,780 --> 00:14:08,710 and then you see the actual value inside the cookie that is stored there. 202 00:14:08,710 --> 00:14:12,130 Then also the expiry date for that cookie setup here. 203 00:14:12,130 --> 00:14:15,460 Now, this value will be exactly what you saw in 204 00:14:15,460 --> 00:14:18,890 the set cookie that came in from the server side. 205 00:14:18,890 --> 00:14:24,620 Now, this also means that in subsequent requests that go in, 206 00:14:24,620 --> 00:14:27,365 so even if I clear out my authorization, 207 00:14:27,365 --> 00:14:31,010 and even if I remove the authorization header, 208 00:14:31,150 --> 00:14:34,225 because the cookie has been set up, 209 00:14:34,225 --> 00:14:37,110 this cookie has been set up on my local host, 210 00:14:37,110 --> 00:14:44,335 every subsequent request going to this this server will include this cookie. 211 00:14:44,335 --> 00:14:51,000 So even though I would not have the headers set up there, 212 00:14:51,000 --> 00:14:52,285 if I send the request, 213 00:14:52,285 --> 00:14:57,940 you will notice that the Git request works just like before without any problem, 214 00:14:57,940 --> 00:15:02,195 because of the fact that each outgoing request will automatically include 215 00:15:02,195 --> 00:15:08,075 this cookie in the outgoing request from my Postman here. 216 00:15:08,075 --> 00:15:13,850 This demonstrates the use of cookies in our application. 217 00:15:13,850 --> 00:15:18,260 With this, we have seen how cookies can be set up and 218 00:15:18,260 --> 00:15:22,404 processed in our express server using the cookie-parser, 219 00:15:22,404 --> 00:15:25,330 and how we can set up signed cookies. 220 00:15:25,330 --> 00:15:31,390 This is a good time for you to do a git commit with the message cookies.