Quite often when building web pages wetend to rely on certain techniques trying to make the users ?play bythe rules? and utilize the web pages in a predictable way. In fact, werely on them so much that sometimes we forget that their power can beturned against our purpose.

Indeed, JavaScript, ?the great and the mighty? can become a dangerous weapon in skillful hands and used not to our advantage.

Onceyou realize how easy it is for a ?total stranger? to ?beat up? your webpage you may decide to review your good techniques and utilize othertools to strengthen the ?line of defense?.

Most of the tricks described in this article are pretty basic and can be put to use by a novice programmer.
After reading the article you will learn a few tricks which may help you with the following:

1. Debugging your own web applications
2. Bypassing bugs and glitches when using web sites built by someone else
3. Minimizing chances for someone trying to use some of those techniques on your web pages.
4. Staying informed of the various possibilities and being prepared to take corresponding actions.

Getting started

Firstof all I would like to remind you that there is absolutely no way toprotect your images as well as HTML, JavaScript and CSS source fromstealing. Anything you can view in your browser can be saved on auser's hard drive and "cut open". One can encounter some difficultieswith certain types of content (like Flash, Java applets or WMV with DRMprotection), but at the end it all depends on the individual's level ofdetermination.

Data security on the other hand is entirely different topic which we won't be discussing today.

The approach

You can execute JavaScript code on a page by typing "JavaScript: somecode;" in the browser's address bar and hitting Enter.

Thecode will immediately execute as long as the syntax is correct. Whenassigning values you have to include the assignment within the void()method as in void(some_variable=some_value). Otherwise the browser willjump to a blank page and output the variable on that page. Rememberthat!

"Please print this page as proof of your purchase?"

As a warm-up let's do something fun and simple.

Youhave probably noticed when making printouts from your browser that theURL of the current web document always appears somewhere on the printedpage. Does this make you believe the content on the printout originatesfrom that URL?

Think again!

By manipulating DOM (Document Object Model) of the web page you can easily change the content of the entire page.


Open any web page that doesn't have frames, paste the following code in the Address bar and hit enter:

javascript:void(document.body.innerHTML="Type whatever you want");


You will get "Type whatever you want" on a blank page.
Nowgo File -> Print Preview and read the URL at the bottom of thepreview page. The URL is still there, but the content has changed towhatever you have typed. That line of code modified the innerHTMLproperty of the document.body object.

You are not restricted to plain text ?HTML will work just as well.
For example the code below will type the text in bold:

javascript:void(document.body.innerHTML="Type whatever you want");

"Pretty lame" ? you say? Here is something a little more elegant:

javascript:void(document.body.topMargin=0);void(document.body.leftMargin=0);
void(document.body.innerHTML='');

Thiscode will create an iframe with macromedia.com web site loaded intocurrent web page. Needless to say you can set the iframe src attributeto anything you want. Just paste and hit enter, then go File->PrintPreview again and make a note of the printout URL again.

In asimilar manner you can modify innerHTML or any other property (forexample image source) of any container on the page by referencing itthrough DOM.

But wait; there is an even easier way to "edit" your web page directly in the browser:

javascript:void(document.body.contentEditable=true);

Executethe code and start editing the web page as you would in a WYSIWYGapplication. Select any text and type, delete, press Ctrl+B to make itbold, select and resize tables, images, etc.
Now, isn't that fun?

Of course the page cannot be saved to the server (or can it?)


Afake printout is by far not the worst thing that may happen when a "badguy" gets his hands on your web page. A malicious user may try toexecute a script to access methods and properties of the Flash objectsembedded on the page, execute remote scripts, etc.

Scared? I didn't think so. The truth is the security wholes are getting tighter with constant browser updates and patches.

Read More