Saturday, October 11, 2014

Web Hacking 101: HTML Editing

Editing the HTML can reveal various security flaws or basic issues with a website. You can use it to reveal hidden information or alter a form's behavior or limitations. This will probably prove the most useful with forms.

The tools required to accomplish this can be Javascript or various addons like Firebug. To understand how to do so with Javascript, it requires a basic understanding of Javascript and DOM. Either method you choose, console addons like Firebug can be very useful, as to avoid putting everything in a Javascript injection.

Most modern browsers now also include built-in inspection tools that allow easy HTML editing as well. These tools are quite handy, but can vary from browser to browser. most often, they can be accessed with a right click, selecting the "Inspect Element" option. You can then edit stuff with a double click on the area of stuff that pops up in the inspector.

So let's look at this with a simple HTML form page I made and editing on Firefox. Here's the code for it.

<!DOCTYPE html>
<html>
    <head>
        <title>Stuff</title>
    </head>
    <body>
        <form>
            <input type="hidden" value="false" name="admin" />
            Enter Password: <input name="pwd" type="password" />
        </form>
    </body>
</html>

First we right click on the element we want and select "Inspect Element" like so.


This should result in something popping up at the bottom. If it's on the wrong thing, just try using the drop down arrows to get to where you need to be.

Then to edit a specific thing, we just double click on it. For example, the "Enter Password:" text.

Let's make this look a little nicer, shall we?



For those paying close attention, you may notice something that doesn't show up on the visible potion of the form. A hidden form element. I made the value quite obvious what it's to do. So how about we change this? Quite simple to do, just double click the part you want to edit, same as before!


Now this is the easiest way to simply alter HTML on your end. While editing things might not be as easy as something this simple or have something as golden as that hidden element, it can still be useful. Much like viewing the source, we get to see the cool hidden stuff, with the added bonus of being able to make alterations and navigate in this handy drop-down fashion with directed right clicking action.

The easy way is fine and dandy, but sometimes it may be better to use Javascript. The reason being is we can add more stuff, like event listeners, have access to variable in the Javascript code itself, add or alter things logically or really anything you could do making your own HTML page with Javascript. All we need to do this is knowledge of Javascript! So either go learn it or enjoy knowing it already.

For the case of this form, we can simply put in the address bar this little snippet. I should mention that in some browsers, this may be disabled or run into some issues for security reasons. The built in console is always an option.

javascript:document.forms[0].admin.value="true";void(0)

Now, like magic, we have altered the value. It's as simple as though you wrote the Javascript code on the page yourself. All we had to do was add "javascript:" to the front to run it in the address bar. Oh, and the void function is necessary because stuff happens. Alternatively, you can use the console on the inspector tool and not need the prefix or the void function, but do note that having void in there won't harm anything. Now the only limit is your imagination... and Javascript skills and Javascript's limitations.

While on the subject, the Firefox addon called Greasemonky, included in my collection of must have tools (more info here), can run code for you when loading a site through userscripts. Can be quite handy should some code alter stuff when the site loads and gets in your way.

Tag Cloud

.NET (1) A+ (2) addon (6) Android (3) anonymous functions (5) application (10) arduino (1) artificial intelligence (2) bash (4) c (7) camera (1) certifications (4) cobol (1) comptia (4) computing (2) css (2) customize (16) encryption (2) error (19) exploit (17) ftp (3) funny (2) gadget (2) games (2) Gtk (1) GUI (5) hardware (6) haskell (15) help (8) HTML (6) irc (2) java (5) javascript (21) Linux (19) Mac (4) malware (2) math (8) network (9) objects (2) OCaml (1) perl (4) php (9) plugin (7) programming (42) python (24) radio (1) regex (3) security (25) sound (1) speakers (1) ssh (3) story (1) Techs from the Crypt (2) telnet (2) tools (14) troubleshooting (5) Ubuntu (4) Unix (4) virtualization (1) web design (14) Windows (7) wx (2)