WEBVTT 00:00.320 --> 00:00.920 Okay guys. 00:00.920 --> 00:08.540 So finally, let's go back to having some fun and building features that we probably will be building 00:08.570 --> 00:11.540 at work or in our personal projects. 00:11.720 --> 00:19.010 So, uh, the next thing I'd like to add is the commenting features for the blog posts. 00:19.010 --> 00:23.540 So we've been waiting for that and now we can safely implement this. 00:23.540 --> 00:26.510 We need the CSF protection. 00:26.510 --> 00:30.110 We also need the authentication system. 00:30.110 --> 00:34.730 And in this video we're going to be implementing this commenting feature. 00:34.730 --> 00:38.720 But only authenticated users will see the form. 00:38.720 --> 00:41.600 Everyone else will see a link to go and sign in. 00:41.600 --> 00:48.380 And also on the form handling code inside the new controller we're going to create, we're gonna check 00:48.380 --> 00:49.460 the CSRF token. 00:49.460 --> 00:56.000 And if the user is authenticated let's get to work okay guys. 00:56.000 --> 01:04.900 So maybe let's begin with the form I think we can actually add the form directly inside the show view 01:04.930 --> 01:09.010 that displays this post and the comments. 01:09.160 --> 01:13.720 So what would what would you say about the form being added? 01:13.750 --> 01:22.450 Maybe here right below this comments subheader but above the actual comments. 01:22.930 --> 01:25.450 So we're gonna use an if statement. 01:25.450 --> 01:29.140 Remember, we've got this magical user variable. 01:30.700 --> 01:38.890 If it is available then someone is signed in, otherwise someone isn't. 01:40.780 --> 01:51.730 So if there is no one sign in, we're gonna display a paragraph with a link to a login page saying login 01:51.760 --> 01:55.690 to comment with a dot. 01:57.290 --> 02:00.560 So it's not visible because I am signed in. 02:00.860 --> 02:04.370 And the alternative is to add a form. 02:05.330 --> 02:07.610 So let's come up with the URL. 02:07.610 --> 02:09.470 So this can be. 02:09.680 --> 02:11.510 Let it be posts. 02:12.770 --> 02:15.920 And let's echo the post id. 02:18.650 --> 02:23.240 And after that let's have comments. 02:23.840 --> 02:25.970 So this would be our URL. 02:25.970 --> 02:35.540 The method is obviously post, as we are sending a form that will change something in the back end server. 02:35.540 --> 02:45.950 Here, let's echo the CSRF token which would render the whole field, and then let's have a text area. 02:46.400 --> 02:53.510 The name is content and it's required. 02:54.140 --> 03:00.070 And then we've got a button of type submit, which is the default anyway. 03:00.370 --> 03:03.310 And we're going to say add comment. 03:03.820 --> 03:09.700 So now when I refresh that it looks like this. 03:10.600 --> 03:10.930 Okay. 03:10.930 --> 03:15.130 So for some reason the text area is not being displayed. 03:15.130 --> 03:17.500 Let's just see what's happening. 03:17.620 --> 03:19.510 So we've got the form. 03:19.510 --> 03:27.910 And it seems that I haven't properly closed the tag where we rendered the token the CSRF token. 03:27.910 --> 03:29.920 Let's jump to this function. 03:31.570 --> 03:34.000 And it seems to be the case. 03:34.000 --> 03:36.550 There is no self-closing here. 03:36.550 --> 03:43.600 So I had to add this self-closing of the element should be fine now. 03:43.630 --> 03:47.170 Well, that's one huge text area. 03:47.200 --> 03:53.080 I think we can set the number of columns using calls. 03:53.080 --> 03:55.050 Let's set it to three. 03:57.120 --> 03:58.500 Sorry, that's not columns. 03:58.500 --> 03:59.850 This would be rows. 03:59.850 --> 04:04.950 I meant rows, so I like shorter comments. 04:04.950 --> 04:06.300 Let's put it this way. 04:06.360 --> 04:07.620 So we've got the form. 04:07.620 --> 04:09.300 Now we need the form handling. 04:09.300 --> 04:14.970 So we need to create a controller, add a route for it and make sure we verify the user is signed in 04:14.970 --> 04:18.210 and that the CSRF token is valid. 04:19.350 --> 04:25.320 So the next sensible step after adding this form is to add a route. 04:26.100 --> 04:27.690 Let me add it right here. 04:28.080 --> 04:32.460 I'm going to add a route that uses the post method. 04:32.460 --> 04:39.660 And it's posts the id parameter of a post, so we know to which post we should add it. 04:39.660 --> 04:42.450 And then it was comments. 04:42.450 --> 04:47.700 The controller is command controller. 04:47.700 --> 04:56.510 Method name is store as we typically do when we store a new resource, like in case of logging in as 04:56.510 --> 04:57.140 well. 04:58.100 --> 05:00.410 Now we have to create this controller. 05:00.410 --> 05:08.390 So let's jump to the controllers folder and create the command controller. 05:08.840 --> 05:11.450 PHP like that. 05:11.450 --> 05:14.180 And then we add the namespace. 05:14.180 --> 05:15.890 This is app 05:17.810 --> 05:24.770 controllers and the class is the command controller. 05:24.800 --> 05:30.470 And for now it has only one action one method which is called store. 05:32.270 --> 05:34.760 And it's going to have one parameter. 05:34.820 --> 05:36.980 Let's call it post id. 05:39.170 --> 05:39.680 Okay guys. 05:39.680 --> 05:41.090 So a quick reminder here. 05:41.090 --> 05:45.410 What needs to happen in this store method. 05:45.440 --> 05:52.350 Can you guess that what we need to deal with when we have a form. 05:52.950 --> 05:58.260 So the first thing is yes, the CSRF token validation. 05:58.350 --> 06:03.060 So let's check for every of those steps separately. 06:03.060 --> 06:05.910 First step is CSRF validation. 06:06.060 --> 06:12.540 Make sure you add this use statement and call the verify class. 06:12.780 --> 06:13.110 Sorry. 06:13.110 --> 06:15.660 The verify method on CSRF class. 06:15.690 --> 06:27.270 If this fails we should do router page expired again. 06:27.270 --> 06:30.810 As I've said, we shouldn't be really doing this manually. 06:30.840 --> 06:32.820 This should happen automatically. 06:32.850 --> 06:38.580 We're gonna get to that later in some subsequent videos. 06:38.640 --> 06:46.260 The next step if the token is fine obviously, and we are using defensive programming here, which should 06:46.260 --> 06:55.070 also simplify the code and should simplify the basically the way to follow the code. 06:55.070 --> 07:02.150 So it's much simpler to see that if something fails, we basically stop at this point, then just having 07:02.150 --> 07:05.300 nested if else statements. 07:05.870 --> 07:08.660 So the next step is to get the user. 07:08.660 --> 07:13.910 So we are using another class called auth which has the user static method. 07:15.020 --> 07:26.330 So if user is falsy which would be the case if the user would be null, then we've got the not found 07:26.330 --> 07:27.620 page expired. 07:27.620 --> 07:29.810 Well we are missing a method. 07:29.810 --> 07:34.700 We should have another one that can be 07:35.990 --> 07:39.410 unauthenticated. 07:40.700 --> 07:42.170 Have I spelled this right? 07:42.200 --> 07:46.040 An authenticated? 07:46.070 --> 07:50.380 Okay, I think that this code is for a one. 07:50.380 --> 07:58.540 So this means that some specific page specific resource needs you to be signed in. 07:59.320 --> 08:08.890 So when I jump to the status codes on this same website, which is super cool, by the way, it's being 08:08.890 --> 08:10.900 described as unauthorized. 08:10.930 --> 08:12.460 Maybe let's use this name. 08:12.460 --> 08:17.560 I wasn't really able to spell the unauthenticated anyway. 08:17.950 --> 08:21.010 So let me just use unauthorized. 08:21.010 --> 08:23.170 And it's exactly what we need. 08:23.200 --> 08:27.280 It's an error that is typically thrown or returned. 08:27.310 --> 08:39.190 However, you phrase that when we have not invalid credentials, so this sounds fine. 08:43.600 --> 08:51.290 Yeah, I think it is fine when we are not authenticated because there is another code called 403 forbidden, 08:51.290 --> 08:58.970 which just means that you are not allowed to perform an action, which means rather that your privileges 08:59.000 --> 09:00.950 are insufficient. 09:00.950 --> 09:02.360 And this is different. 09:02.360 --> 09:06.920 This means that you are not authorized the entry in the first place. 09:07.700 --> 09:14.210 Again, we would have to add a view which we don't have right now, which is 401 PHP. 09:15.080 --> 09:22.130 As usual, let me quickly create that by using a method called copy pasting. 09:22.340 --> 09:31.550 This is an okay, I'm gonna just copy that because this is a tough word for me to spell. 09:31.760 --> 09:40.490 And let's say you are not authorized to do this. 09:44.200 --> 09:51.790 And let's just direct people optionally to the login page. 09:52.360 --> 09:53.740 Let's close this one. 09:53.740 --> 09:54.880 Let's close that one. 09:54.880 --> 09:58.960 And we are returning the right error and rendering the right view. 09:58.990 --> 10:01.870 Okay let's go back to the controller. 10:03.760 --> 10:11.800 So if there is no user we do unauthorized which basically stops the execution. 10:11.800 --> 10:15.160 So nothing else to do here. 10:16.240 --> 10:22.690 And next up we're going to get the content from the post. 10:25.180 --> 10:26.950 And I think we've got everything. 10:26.950 --> 10:36.010 So at this point we can use the comment model create method and pass some data into it. 10:36.910 --> 10:46.590 So to connect it to the post we're just going to pass the post ID, which we have it because it's part 10:46.590 --> 10:50.880 of the URL parameter and that's why we needed it. 10:50.910 --> 10:54.420 It's super handy to just have the post ID at hand. 10:55.140 --> 10:57.270 Next up we need the user ID. 10:58.560 --> 11:00.510 Where do we get this from? 11:00.540 --> 11:02.760 Well we have the user model. 11:03.360 --> 11:05.100 So this is where we get it from. 11:05.160 --> 11:12.540 And the content is the only thing that is actually sent through a form. 11:12.570 --> 11:19.920 And after we start the comment we can just do a redirect. 11:20.070 --> 11:25.440 So we do router redirect and let's construct the URL. 11:25.440 --> 11:28.260 This is posts. 11:28.950 --> 11:32.640 Then we're gonna use the post id. 11:35.070 --> 11:41.090 And I'm not sure if we've got this ID comments. 11:41.510 --> 11:43.640 Well, we're gonna see anyway. 11:43.640 --> 11:47.660 Let's redirect someone to the post page first. 11:47.660 --> 11:51.200 Then we're gonna see what can we do later on. 11:51.770 --> 11:52.310 All right. 11:52.310 --> 11:55.160 I think this looks fine. 11:55.160 --> 12:00.500 And it's about time that we see if it works. 12:02.060 --> 12:03.560 So let me refresh the page. 12:03.560 --> 12:05.930 So we have the fresh CSRF token. 12:05.930 --> 12:12.740 And let's say we are testing if this works or not. 12:16.820 --> 12:27.380 Okay guys I think the issue is that inside the comment controller I should really use exactly the same 12:27.380 --> 12:33.050 names as we have defined in the root. 12:33.620 --> 12:34.850 I think that's the case. 12:34.850 --> 12:36.860 So let's see. 12:36.890 --> 12:42.780 Let me replace the post ID with just ID and let's refresh the form. 12:44.310 --> 12:46.560 Seems that now it worked. 12:47.190 --> 12:51.150 So I think you can see my comment right here. 12:51.150 --> 12:53.010 So what can I say? 12:53.010 --> 12:59.190 It worked perfectly and we were redirected to the right page. 12:59.640 --> 13:00.150 All right. 13:00.180 --> 13:03.600 Now let's also jump to this show page. 13:03.600 --> 13:10.650 And if I will add the ID on this header like that. 13:10.650 --> 13:11.730 Comments. 13:11.730 --> 13:21.150 Then when the comment is added I can also redirect to the comments so that you can see your comment 13:21.150 --> 13:25.380 as it was added instead of seeing the post first. 13:25.380 --> 13:35.250 So we can just quickly verify that you were indeed successful and basically this functionality is completed. 13:35.250 --> 13:36.870 We can add comments.