1. Home
  2. Training Library
  3. Programming
  4. Programming Courses
  5. A Practical Introduction to HTML Injection

Hacking with Forms



The course is part of this learning path

Start course
1h 34m

This course explores HTML injection, stored HTML injection, and other types of attacks in order to begin carrying out some web pen testing in a practical way. 

Intended Audience

This course is intended for anyone who wants to learn the necessary skills to become an ethical hacker and/or a bug bounty hunter.


We recommend that this course be taken as part of our Web Penetration Testing & Bug Bounty Hunting learning path.


Hi. Within this lecture, we're going to see an alternative way for hackers to exploit this vulnerability. And in fact, we don't actually want to deal with that kind of thing because it's illegal to take advantage of these vulnerabilities. Even if we find them, we have to submit them to the website administration so we can get back some bounties or stuff. But again, it will be good practice for you to learn about HTML Injections. So, I'm going to show you one more example. So, I'm going to open Geany. So, if you have practiced the html101 section with any other editor, you're more than welcome to open it. We are going to close this down and open a new HTML obviously. This is the html101 thing that we have worked with. We're going to work with forms, actually. We're going to create a simple form that we can inject in the blogging section asking for usernames and passwords from the user. So, I'm going to call this myform.html. Again, you don't have to do this with Geany. You can just do this with any other script editor that you have used in the previous section as well. And again, we're not going to focus on exploiting or taking leverage of these vulnerabilities very much. In this course, we're going to focus on finding the vulnerabilities and submitting them for bug bounties but this would be a good practice for us. So, I'm going to create a form and just name this login. We can just name it anything we want. Name doesn't actually matter at this point but action matters. So, what we want to do over here is to just close this down and just have this closing tag so that we won't forget it later on. So, we change one attribute named login, then we're going to change one attribute named action. And this action will forward the username and the password or any other information that we gather from the user to us, for example to in my case and you have to put your own IP, obviously. I'm going to choose the same thing like we have done before. I'm going to say 4545/tests.html. So, if some other part worked for you, just go for it. So, this will just do some a login operation but in fact, it won't do much. It will just forward the information back to us. So, if a user believes in this form and gives some information, it will be forward to us. So, this is classic way of how hackers exploit when they see a stored HTML injection. So within this form, obviously, we need some kind of input that we want to get and we can use the built-in things and the label things or the input itself in order to make this work. To start with input, first of all, the type will be text, name will be username. If you want, you can just put a placeholder here as well, like a username and then just close the tag. And again, this is half-closing tag so you don't have to just close it manually. And we're going to have one more input over here. It will be a type of password and name will be password as well. Name doesn't matter as I said before. So for the placeholder, I'm going to say password one more time. So it's basically, password, password, password. And here you go. This is our form. So, if we open this, it won't look good. So, let me show you what I mean. Let me just minimize everything and find myform.html. I believe it's in the Documents. If I open this with Firefox. Here you go. This is the form. It's not looking good. We can have this like side to side form. We never see this in real life. So, we can just take the password and put it below the username which will make much more sense. So in order to do that, I'm going to make this a little bit pretty. It's good to be pretty in this case so that users will not raise any suspicion. So, here we go. I'm going to take this into a table. We haven't seen tables. And tables are a way to organize our elements by using rows and columns. So, think this is something like an Excel table. You have rows. You have columns. And once we do that, it didn't change anything because we haven't specified the positions of these inputs over here. In order to do that, let me just put this in this way so that we can understand what is inside of what. Like that. We have the form. We have the table in it and then we have the input inside of this table. So, I'm going to open something called tr. And I'm going to cut this from here because I want to close the tag in this place. So, this stands for table row. And I'm going to just do the same thing in here as well. If I do this, it won't create two rows and it would be much more good looking right now. However, it's not enough. We need to have a username label over here rather than label. We can just come over here and write td. It's kind of creating a new division in here and we can just say Username: and put a space. So, it will be shown before the user input itself and we can just wrap this around the td as well. Like that. Just don't forget to take this td and cut it from here and put it right after the input itself. So, it has to be exactly like this. Tr, td, td, td, input, td, tr. Just don't get lost with inside of the tags over here. Just pause the video if you want and look what I'm writing. It has to be exactly the same. So td, something like that and I'm going to just cut this from here and put it over there to close this tag. So, what it does if we refresh it? Here we go now. It's looking much better in here. So, this is a Username. This's a Password. They are looking very organized because they are inside of table. So, we have a good form. So, this is our form. Maybe you may want to save this so you can use it afterwards in your penetration test. We can have another input over here if we want, like with the type of submit because we're going to need a button. So, I'm going to say the value will be login. And that's all right, I believe. It will display the login like this. And if we click on this, this username and password will be sent to us. It will be submitted. So, that's our form. That's outside of the table by the way, as you can see. Not inside.


About the Author
Learning Paths

Atil is an instructor at Bogazici University, where he graduated back in 2010. He is also co-founder of Academy Club, which provides training, and Pera Games, which operates in the mobile gaming industry.