Copy/paste disable

Tuesday, June 21, 2011

FORM EDITING USING JAVASCRIPT INJECTION

Share
=========
Introduction
=========

Have you ever been to a school or a friends computer and seen saved passwords before loging into an account? Have you tried copying the bulleted password and pasted it on notepad hoping to see the plain-text password?

Perhaps you've been to websites where you can only enter a certain amount of characters to submit a web-form successfully. Have you tried to modify the HTML code offline and still have no luck in attaining the results you like?

If this sounds like you, keep reading!

This tutorial will describe how to manipulate HTML forms and edit your own values through Javascript Injection. Javascript Injection is when you insert your own Javascript Code to websites through the URL. These changes are only temporarily because Javascript is a client side language. This is, at times, necessary because some sites make sure you submit the form from the website like you were suppose to, therefore, offline source code editing will NOT work.

I'll start by discussing basics in form editing, then ill progress to talk about how to make really good use of JSi!


=========================
Javascript Injection! Form Editing
=========================

Before we begin, we need to understand that every form on a web page is contained in an Array called forms[x], unless specified otherwise. The variable x is the number of all forms in the page. Chronologically, the forms start from 0, therefore, the first form will be 0 and the second form will be 1 and it will continue in this fashion.

Take a look at this form snippet for example:


<html>
<body>
<form action="http://www.website.com/submit.php" method="post">
<input type="hidden" name="to" value="r00t@website.com">
</body>
</html>

Because this is the first form on the webpage, it will become forms[0] when we place it on the Javascript code. Most of us will try to download source code and edit the page offline, but if the submit.php script checks for the referrer, this will not be possible. Because of this, we need to edit the form through the URL!

You can use the following Javascript to check the Value a certain form element has. Since the value, according to the code snippet above, is r00t@website.com, that is whats going to be displayed:



jalert(document.forms[0].to.value);


When this is send through the address bar, r00t@website.com will pop up in an alert box as expected. The form[0] specifies that its the first form, and we wanted the value to be displayed.

Before i continue, I want to elaborate on something important. The Javascript Code that was inserted came directly from the HTML code that the form provided. For example, take a look at this code snippet:


<html>
<body>
<form action="http://www.website.com/submit.php" method="post">
<input type="hidden" name="email" value="r00t@website.com">
</body>
</html>

In the input tag, the name was changed from "to" to "email." This will affect the Javascript Code inserted! The code to inject will now look like:

jalert(document.forms[0].email.value);

As you can see, the Injected code varies on the form naming rules. Its laid out as document.forms[x].name.value in the input HTML tag.

Now lets resume where we left off. Now that you know we have to edit the form from the URL because the PHP script checks the referrer, we need to change the value "r00t@website.com" to our email address in order for whatever gets submitted be sent to us.

So how do we replace the current form email address with our? Easy, all you have to do is give the form a new value through this script:


jalert(document.forms[0].to.value="hacker@website.com");


This will change the email on the form to hacker@website.com. How do you know if you did it right? You can use the previous script to check your work!

If you type, assuming we used the first code snippet where the name was "to" in the input tag:


jalert(document.forms[0].to.value);


hacker@website.com will pop up in an alert box! This is an indication that we have correctly modified the value on the form, now all you have to do is submit the form!

===============================
Snooping Around Gmail and Yahoo Forms
===============================

Now that we know a little more about forms and how one can manipulate them using Javascript, lets get some saved username and passwords from Gmail and Yahoo Mail.

When people sign into Facebook, Gmail, or Yahoo, there is only one form, The form that handles username or emails and then the password for that account. Since we know there is one form that handles Authentication, we know that we will be using forms[0].

What we are essentially doing is finding the values for certain fields individually. We do not know the names of these fields but its self-explanatory to what they are. We can however find the field names. Another concept i want to talk about is elements!

A HTML element is an individual component of a form.

For example, if we know that in the first form there are fields for username and passwords that have saved credentials already, we need to know what element they are corresponding to that form. Yes! username and passwords elements will differ in their numbers because the location vary from form to form!

To make things easier, ill put it this way, just try to follow the thought process. Like I said an element is a single component, so lets say this HTML form have these elements laid out in this fashion:


1st element= IP address
2nd element= Referrer
3rd element= Last login
4th element= Username/email
5th element= Password


If this was the form of Gmail Account we obviously want the username and password so the elements we want is the 4th and 5th.

So how does the Javascript Injection look like?? Simply put, the first injection will look like:


jalert(document.forms[0].elements[4].value);

This will give you the username:

Then the second injection will look like:

jalert(document.forms[0].elements[5].value);

This will give you the password!


If we analyze the code, we want the 4th and 5th element from the first form. We need two separate injections because they are stored individually.

================
Real World Examples!
================

Enough with the technical stuff, these actual images will show you how to hack Gmail and Yahoo accounts that have saved passwords.

For Gmail, the Username element happened to be the 12th:


jalert(document.forms[0].elements[12].value);
[Image: gmail_user.jpg]



And the Password element happened to be the 13th:


jalert(document.forms[0].elements[13].value);
[Image: gmail_pass.jpg]


For Yahoo, the Username element happened to be the 24th:

jalert(document.forms[0].elements[24].value);
[Image: yahoo_user.jpg]


And the Password element happened to be the 25th:

jalert(document.forms[0].elements[25].value);
[Image: yahoo_pass.jpg]


==========
Final Words
==========

As you can see, form manipulation can be fun with a little knowledge on how forms work and how things are laid out. Moreover, you wont need software to help you unravel passwords in asterisks. This tutorial did not include everything about Javascript Injection. There are some things i did leave out because it wasn't entirely necessary to discuss, for example changing cookie values because that will segue into more of Cross Site Scripting.

Hopefully everyone enjoyed reading this

1 comment:

Robert Parham said...

seriously, fuck you for using those colors and disabling highlight. and you don't even explain what jalert() does. this tutorial is probably just bs you copied from some other website, you haven't actually explained anything.