How you doing in my job description shopping cart tutorial?

I got a comment related to Java script injection and how it could be a problem for people that are using job disappeared.

I figured that this was such a great topic that I decided to make an entire video about the most common form of JavaScript injection that you'll run into when you're developing your own websites.

So let's get started doing that right now, So I have this amazing website, but at first, plans look completely normal.

You type in and input here just high.

For example, you click search and I just say you quit high and in the euro it'll put your query up here.

That's all it does.

Super simple, straightforward website.

And you think there's nothing wrong with this website, right?

Typing whatever you want it enter and that you go shows you exactly what you quitted right there.

But this site is actually vulnerable to Java script injection.

Now, your first thought would be if you want to inject your office script into a page, you put some script tags here, write some Java script inside of it, so let's just say hi inside of an alert, and then you would end that script tag.

And you'd think by running this you would inject JavaScript on the page and you are correct.

You do inject this script tag into the page, but script tags will not run when they're injected into the page in the spanner.

In orderto actually inject job description to the page, we need to use an image tag, surprisingly, with a blank source.

When an image tag has no source, it'll throw on air.

We can use the on air function of this image source to run some code.

Whenever this image, it's loaded into our page, since there is no source for so we'll just put that alert inside of our on air function here, close out our image tag, and if we hit search, you'll see that we not have this alert box that pops up.

This is high and anything that we put it aside to hear.

For example, when we search, it'll show up in here.

So we've essentially injected javascript into the page, and now you may be thinking that's not really a problem, because you're just injecting javascript into your own page is the only person you can affect is yourself.

But since this query is inside of the Earl here, if I send this euro to somebody as soon as they go to it, it'll inject this into their page.

So, for example, if I go to a new tab here and search this euro, you see that I get this hacked message, which is what a hacker would want to do.

And you may think, Well, what can they do with this?

They can access some pretty sensitive information.

For example, they can access the document cookies.

So what is going here with another alert?

We'll just say document Doc Cookie.

And if we run this again, you can ask the They have access to my user name and my password, which was stored in the cookies for this website.

Now in a normal website.

They wouldn't actually store your password and user name, but they will store a session I D, which is essentially both your password and user name together.

And if you have access to that, you can log into the site as that user.

This is something that a hacker could do in order to gain your information and then all they would have to do inside of their script is just email this or send it to their own site.

And then they'll have that information available to themselves just based on this simple JavaScript injection that they're able to perform with this search query.

So now let's look at how we can solve this problem If we look at the actual code for this page.

Here we see that one.

Our page loads.

We get our query from the euro.

So we get this attribute here that we sent to the page with the search.

And then we're studying that to the input so that it's displayed here.

And we're also studying it to this query output where it says you quit and then whatever you queer, but we're using inner HTML and in your HTML is not safe to injection.

If the user inputs valid HTML or a script tag or an image take, it'll render that as actual HTML instead of ass text.

In order to get around this, all we need to do is change this to be in our text.

Now If we say that and run, you see that it just shows, detects that they put inside of input box and not actually injects it into the page.

And you may think that you're never gonna end up running into this problem because, obviously, why would you use inner HTML here?

But there are many instances where you may wanna inject dynamic HTML into your page, and in order to do that, you're going to need to use inner HTML.

But if you do use underage demote, you need to make sure nothing that goes into that inner HTML is sent to you by the user unless you first escape that user input.

So essentially make us that that user input will render is a string no matter what you do.

Because you escaped out all of the different HTML specific symbols so that it can no longer be rendered as HTML and must be rendered his text.

So I hope you guys enjoyed this quick video on one of the most common ways that Java script injection will happen in your Web pages.