This episode is for members only

Level up with a premium membership

Join now
Already a member? Sign in to continue
Playing
36. Adding tokens to forms

Episodes

0%
Your progress
  • Total: 4h 32m
  • Played: 0m
  • Remaining: 4h 32m
Join or sign in to track your progress

Transcript

00:00
So now that we have our cross-site request forgery token middleware applied,
00:03
we can't really do much until we apply this to our form. Now there's a couple of ways that you could do this. On any of the pages that you want to show this token or output this token within the form, for example, within our navigation, we could pass down from our controller
00:20
the token name key, the token name value, and the token value key, and the token value. Let's have a look at what this looks like and then we'll look at how we can extract this out. So we're going to end up with two hidden inputs. So we're going to have a hidden input in here with a specific name.
00:38
This will be a randomly generated name and a randomly generated value. Then we'll have a token name. So this will be something else. It doesn't really matter.
00:49
And we'll have a value for this as well. So these things will be randomly generated by that cross-site request forgery guard class, and we need to output them. But we don't really want to have to pass these down to a controller
01:02
every single time we want to apply cross-site request forgery protection. We're going to need to apply this to our register form and also our login form. So having to pass this down from a controller every single time is going to get a little bit annoying.
01:15
So we're going to go and build out a helper function. So let's go over to our Twig runtime extension, and let's create out a new function in here or a new method in here, which gives us back a cross-site request forgery token.
01:28
So effectively from here, what we're going to do is return to marker. So we're going to have an input in here with a type of hidden. That's going to have a name, and that's going to have a value as well. And there are a couple of other ways that we could output this HTML,
01:42
but let's just keep it really simple for now. And we're going to have this data in here as well. OK, so now that we've got this, what we want to do is pull out that guard class from our container.
01:54
So let's go ahead and grab this container and get cross-site request forgery. Now, let's go ahead and just look at one of the methods that we're going to need, and then we'll fill in the rest. So I'm going to go ahead and dump and kill the page here.
02:07
And let's go ahead and from guard access the get token key name method. So if we just open this up within the guard class, get token key name, this gives us the key for the first input that we need to implement. So let's just have a look at this by trying to use this over in our navigation.
02:28
So let's use cross-site request forgery in here, and let's see what happens. So let's go back and give that refresh. And yeah, of course, we just need to add this to our Twig extension here. So let's go ahead and pull in a line to reference that.
02:45
And we should see the output on the page. OK, so an incorrect method here. I probably just wrote this down wrong. So it should be name key.
02:54
And let's try that out again. Great. So now we've got cross-site request forgery token name. So that's the name of the key that we need to use.
03:02
That's the guard, the middleware will actually pick up. So we can take this and we can put this inside of the name just here. Now, we also have the name value, which is just get token name. And you can see that this changes every single time.
03:18
So every time this route is being hit, that middleware is generating out this new value. Let's grab this and put this into the value inside of here. And that will give us our first input that needs to be validated by that middleware. Now, the next two are very similar.
03:35
We just have the token value key. So let's have a look at that. And that will just give us the key for that value. The reason that we do this is because if this changes with inside of the middleware of what
03:49
key needs to be checked when we post through, we have a reference to it directly. We could manually put this in here. But like I said, if it ever changes, it's not going to work. OK, so we're going to put that into here.
04:02
So let's get rid of that extra single quote. And that's in there now. And then last but not least, we have the value itself. This will be a lot longer and more cryptographically secure.
04:14
So we have this to put directly into the value here. So now that we have done this, let's just pull this into the value here. What's going to happen is when we submit or when we output this token on the form and we submit this, Slim will check this name exists within our parse body, which we saw
04:34
within the middleware. And this one as well, it will compare these to the ones that it has generated for every single request. If they match, we'll be let through and we'll be able to post through.
04:44
If it doesn't match, we'll see that error that we saw before. Now, there's one issue here. We're returning this value. But if we just check this out, you can see that it literally outputs this in the markup.
04:54
That's just because we're outputting markup, which is automatically escaped with Twig. What we need to do, because we trust this data, we want to output the raw value of this. To do this, we can use a filter within Twig and we can use raw separated by a pipe. And that's going to actually output the value.
05:13
So if we just check our page source now, you can see that sure enough, that hidden input is in there with the value and the name. Now that refreshes every single time and changes for security. When we submit this through, once we land on this page, it should match and we should
05:28
be allowed to log out. And you can see that sure enough, we are. OK, so the last thing that we need to do, really importantly, is apply this to our login and register forms.
05:35
Now, if we head over to login and try and submit this, you can see that we get a failed check because we've applied that middleware globally. So we're just going to head over to our login page here or our login form, paste this in here, and we're going to do the same thing for register as well.
05:50
So we'll just put that at the very top of the form. OK, so now that we've done that, we should be able to sign in as normal and everything is working. We now have much more security on our forms thanks to cross-site request forgery protection.
50 episodes4 hrs 32 mins

Course overview

Starting completely from scratch, build a modern PHP framework with all the features you’d expect.

Whether you’re new to PHP or not, this is a great exercise for learning what happens under the hood, arming you with knowledge you can apply anywhere you use PHP.

We’ll cover routing, controllers, views, the container, accessing the database, models, authentication, config, CSRF protection, exception handling, pagination, validation, flashing messages and much more.

Let’s dive in and build a PHP framework, step-by-step!

Alex Garrett-Smith
Alex Garrett-Smith
Hey, I'm the founder of Codecourse!

Comments

No comments, yet. Be the first to leave a comment.