on the page. And that's what cross-site scripting is. So let's have a look at our demo app and see what we can find. So the first thing that jumps out at me on this page, if we're looking for user inputs, is the search box, as it does for other vulnerabilities that we've exploited. So what we want to do is figure out, is this search box exploitable? Does it allow us to execute our own JavaScript? So first up, we want to check to see if it will display the information that we put into it. So I just type in Hello World and submit that.

vulnerable. Now hopefully the answer here is immediately obvious to you, but if you're not familiar with Blade and escaping tags, what we have here are the unescaping tags. What we can do is replace it with the escaping tags, which is the double curly, rather than the curly and exclamation marks, and then it will escape all the values that are inside of it. So I'm going to go save for that, and then I'll change back over to our page, and I'll refresh. And as you can see, the difference is we now have the full string in the input, rather than breaking out at the double quote sign.

So let's look at our next example, where it has more complexity, and we'll dig into further the ways in which you can use these tags, and when you do want to use them, and when you have to reach for other tricks. Okay, so we're here on our book editing page. And in the book description field, we'll notice that it's a text field, which suggests that maybe we can do some tricks through here, maybe there's some formatting things we can play with. And so I'm just going to try something simple to start with and see what happens. So I'm going to put some new lines in, like so. So I've put our <script> tag in here, and I'm going to click save, and we're going to see

And it doesn't matter when they access it, as long as the code is still there. As long as you inject the JavaScript, your cross-site scripting is still on that page. They don't need to click on a special link, or go to it at a special time, they just need to go to the vulnerable page that you've seeded. So this looks like the same sort of example we had before, but there is something different about this, and we want to look at why the developer might have done this, why this input is vulnerable to this attack. So let's jump over to the code and have a look, and see what it will tell us. Okay, so we're looking at the code here, and we can immediately see what's going on. So again, as we would expect, they're running the unescaped blade tags here, the curly and

Okay, so we're looking at the code here, and we can immediately see what's going on. So again, as we would expect, they're running the unescaped Blade tags here, the curly and then the double exclamation mark, but they've also got an nl2br in there. And for those who've never heard of this before, it's a simple php function that converts new lines into breaks, so tags. And it's quite useful when you have user input, and you want to honor their new lines, but you don't want any other inputs, so any other formatting information they put in there, any other tags or anything else, and so you can use nl2br to convert their new lines into tags. The problem is though, because we're not escaping any of this, and nl2br doesn't do any escaping,

break tags. The problem is though, because we're not escaping any of this, and nl2br doesn't do any escaping, the HTML, the JavaScript that has been put into that field by the attacker, is being loaded on the page. So how do we solve this problem? Because if we change the tags around, and make them double curlies, we're going to see the break tags, we're not going to see the effects of nl2br, we're going to see the break tags, rather than the new lines. And we want to see the new lines in there, we want that formatting. Well luckily for us, Laravel makes this easy, as it does in a lot of things, and we can

And we want to see the new lines in there, we want that formatting. Well luckily for us, Laravel makes this easy, as it does in a lot of things, and we can escape the description before it goes into nl2br. So we can do that by adding in the e method, which is Laravel's escaping method. So e is what the escaping tags use internally, and it runs the input through a robust escaping algorithm, in order to convert all the unsafe characters to safe characters, so it can be displayed. So now we'll load that on the page again, I'm going to go refresh, and there we go, we now have our script alert, boom, it's being displayed, it's being escaped, it's safe to display.

we now have our script alert, boom, it's being displayed, it's being escaped, it's safe to display. And so that has solved the problem. So we could leave this here, this is a perfectly acceptable level to leave it at, but if we look at the code, it's kind of ugly having nl2br here, so the nl2br and escaping here, and it's really easy to forget one of these many steps, because every time you want to display the description, you have to wrap in the nl2br and e inside the unescape tags. Wouldn't it be nicer to be able to do something like this? Wouldn't that be nicer? We could just use that wherever we want to in the application.

Wouldn't that be nicer? We could just use that wherever we want to in the application. So let's do that. Let's add that as an attribute into the model. Okay, so we're in the model, let's add the attribute, escapeDescription, getAttribute, and then we're going to do this, is that the right number, I think that's right. No, I need another one, don't I? Okay, so let's go back into the page and we'll see if this is still working as we want it to work.

Okay, so let's go back into the page and we'll see if this is still working as we want it to work. Refresh, fantastic, it's still working, great. So again, this is a good, we could leave it here, and this is an acceptable spot to leave it, but I recommend you take it one step further. So we'll go back over to our code. Now if we look here, the problem we have is that we're still using the unescape tags, and we need to remember to use them anytime we're displaying this escape description. Now the name of the attribute does imply what we're loading up, but it would be nicer if we could actually use the escape tags, wouldn't it?

Now the name of the attribute does imply what we're loading up, but it would be nicer if we could actually use the escape tags, wouldn't it? So we could do this, and this. That would be a much nicer way to do it. And the best bit is we can do this, Laravel gives us a way. So if we jump over into our attribute again, and what we can do here is wrap this bit inside the HTMLString class. Okay, we can wrap that in the new HTMLString class. So what this is doing now is we've got the raw description here, and then what we're doing is we're escaping it using Laravel's escaping function, then we're passing that.

So what this is doing now is we've got the raw description here, and then what we're doing is we're escaping it using Laravel's escaping function, then we're passing that into nl2br, which is converting our new lines into breaks, then we're wrapping it inside an HTML string object. Now the HTML string object, if we go into it, implements HTMLable as an interface. If we go into Laravel's escaping function, the e here, what it does is it checks for HTMLable, and so when the escaping function finds the value is HTMLable, an instance of the HTMLable interface, it will return the raw value. Now the blade tag, now the escaping blade tags here use Laravel's escaping function under the hood, which means that when they see an instance of the HTML string class,

Now the Blade tag, now the escaping Blade tags here use Laravel's escaping function under the hood, which means that when they see an instance of the HTML string class, they will return it raw, they won't escape it, which means that it should display everything we want it to display and allow the nl2br to work without needing us to do unescaped tags here. So let's go over to the page and check it. Okay, we're on the page now, I'm going to refresh, there we go. It is still escaping the output, and we'll just confirm our new lines are working. So I'm going to put it here and go, hello new line, go save, there we go. So we now have a really nice elegant Blade, which is fully escaping the output and it's

So I'm going to put it here and go, hello new line, go save, there we go. So we now have a really nice elegant Blade, which is fully escaping the output and it's using the escaping tags, which we want to see everywhere. We don't want to use non-escaping tags anywhere if we can help it, but it is still allowing us to use our complicated, not our complicated, the special logic in the escape description here to use nl2br and escape the value. And so it makes it really reusable and really easy to remember because we're not doing anything special in the Blade and we have all of the custom logic running right here.