OK, I had a tremendous urge to call this post “Hacking Web Interfaces”. But due to some uneducated folks who believe hacking is a bad word, I think I will stick to its euphemism.

The most direct way to feed random data to a web-service is in a raw format. Use telnet for absolute low level communications or tools like Fiddler, for communications at a higher level like HTTP. But with sites hosting hundreds of script files and html pages on their server, this approach has become more and more impractical. But there are other means to mess with the client side code.

DOM Inspector

If you use Firefox, you will notice there’s a utility called DOM Inspector that is included with it. As the name suggests, it allows you to see the DOM of the rendered HTML page. But, it also allows you to modify that DOM. You can modify the values of the properties of different DOM objects in the tree and even insert new objects.

Let’s try this technique on a product of one of the largest software companies, Google Calendar. I will use no other software than Firefox and DOM inspector.

Let’s go to the Settings screen. They have a setting for the “Custom View” property for the calendar.

Now I am a guy who wants to know what he would be doing in next 2 months but there is no option for that kind of view. Hmm, lets see if the DOM can help us. Firing the DOM Inspector, we see that the logic is quite simple.

The value of the ComboBox determines how the duration for which the custom view display the calendar. The value in the ComboBox is simply translated to the number of days. So I change the value to 42 (which is 6 weeks) and save my Settings. Et voilà, I get a custom view with 6 weeks Cool!

Using Visual Studio with IE

IE has a script debugger built in, but it is worthwhile to go in for Visual Studio as the debugger of choice. There’s a free version of the Visual Studio suite called the Express edition available which you can download and use.

Now to make it work…

1. Enable Script debugging in Internet Explorer.

   

2. Create a New Solution with an Empty Website (File > New > Web Site…)

   

3. Go to Property Pages for the new Website in Solution Explorer and enter the URL you want to debug. Don’t worry if you don’t know the URL, just enter any URL and fire the breakpoints only when you hit the required URL.

   

4. You might get a dialog asking you to include the web.config file. Answer Yes and continue. Now you will be surfing with the debugger attached to Internet Explorer. You can hit pause, set breakpoints and even skip those functions that don’t interest you

Using Venkman with Firefox

I would have loved it if Visual Studio also worked with Firefox. There’s a solution called Venkman. I won’t go through the complete detail of how to go about using it, you can read it up here.

I haven’t found a way to skip code (a la Visual Studio) using this yet.

You can change variable values by directly typing the JavaScript code for it.

The interface doesn’t have all the bells and whistles but should be able to get most of your work done.

In this post I take a look at some ridiculously simple security blunders committed by popular sites. These might not always be critical but provide an interesting insight into the design quality metrics followed at these companies.

While surfing the Net, whenever I see a website offering a cool service, my natural instinct is to find out how they are doing it. For example, Rediff used to have this ActiveX based multilingual mail composition feature, which they replaced with a JavaScript based one. Cool! So now I could work on Firefox and still send my mail in Hindi! How (naively?) were they doing this? Create an IFrame and put the entire composition feature in it. Hmmm, OK, but couldn’t someone just rip off the JS files and create, say, a multilingual composition plugin for WordPress using their code. Access to the .js files doesn’t even require a login to the Rediff servers and using them is as easy as pointing the URL to http://f1mail.rediff.com/quill/QuillPadWeb.html. I am not sure what their testing team (if they have one) thought of this, but this allows someone to use the cool text entry interface by just copying 4 files off the Rediff site.

The easiest way to thwart leechers is to deny access to the scripts unless you are logged on. That would take care of direct linking (protecting computational resources). But there’s no easy solution if someone just copies the files off the server and hosts them on his website (protecting intellectual resources). What do you do then? Probably obfuscate the code enough so that he never knows what file he has to copy. Yahoo mail does an excellent job of the obfuscation. Even their images are protected (in a loose way) by referring them through their MD5 hashes; enough to deter a casual hacker.

Another flaw is doing all (and I mean ALL) the validation at the client side using JavaScript. Client side validation is a nice way to reduce load at the server end. But sometimes, this solution is implemented without safeguards.

While designing any API, there is a golden rule that has to be followed…


All input is evil

Agreed, you have JS to check and ensure that the user input is correct. But what if I inject code through your web service using a simple script debugger like Visual Studio for IE and Venkman for Firefox. Even if I am not able to inject code, I will certainly be able to inject syntactically valid input data which is still invalid. To illustrate, imagine a banking service where the amount that can be withdrawn is checked against current balance using JavaScript. I could very well skip the function, overwrite the function which gets the current balance and a lot more. Unless the server is checking the validity of the transaction itself, I would be able to make any kind of transaction.

In my next post I will discuss, some techniques that can be misused to thwart JavaScript based validations. The purpose of the post will be to further educate software designers about the pitfalls of client side validation which is not backed by robust server side validation.

One of the gripes I had about this was that I had to install Firefox for every Operating System (OS) that was there on my computer. So on my home computer which had Windows ME, Windows XP and Ubuntu, I had to install Firefox separatelyfor each of them. I could understand this as they were separate OSes and required different binaries for themselves. But installing all the Extensions and Themes for each and every OS was just plain irritating.

Browsing through www.mozilla.org I saw an article on Profile management in Firefox. Profiles allow different users to have individual settings for a software on the same computer. But this is not what I wanted to do. I wanted to use the same profile across different installations of Firefox, on different OSes, in my machine.

So how I did this was -

1. This step can vary but I will outline the simplest solution. Linux can access your mounted FAT or NTFS drives easily. So we would create the profile folder on a Windows partition and instruct Linux to read data from there.

   For this, locate the profile in Windows and note down the name like xxxxxxxx.default. It will reside  

   • On Windows Vista/XP/2000, the path is usually %AppData%\Mozilla\Firefox\Profiles\xxxxxxxx.default\, where xxxxxxxx is a random string of 8 characters. Just browse to C:\Documents and Settings\[User Name]\Application Data\Mozilla\Firefox\Profiles\ on Windows XP/2000 or C:\users\[User Name]\AppData\Roaming\Mozilla\Firefox\Profiles\ on Windows Vista, and the rest should be obvious.
   • On Windows 95/98/Me, the path is usually C:\WINDOWS\Application Data\Mozilla\Firefox\Profiles\xxxxxxxx.default\

2. Now for each of the other OSes, open up profiles.ini in a text editor. The file is located in the application data folder for Firefox:

   • On Windows Vista/XP/2000, the path is %AppData%\Mozilla\Firefox\
   • On Windows 95/98/Me, the path is usually C:\WINDOWS\Application Data\Mozilla\Firefox\
   • On Linux, the path is ~/.mozilla/firefox/
3. Change IsRelative=1 to IsRelative=0.
4. Change Path=<something> to Path=C:\WINDOWS\Application Data\Mozilla\Firefox\Profiles\xxxxxxxx.default\ (assuming that the profile that you selected in step 1 was in this location).
5. For Linux, set the Path according to the location of the folder in the mounted drive (Assuming the local mount folder is /media/cdrive your path will be /media/cdrive/WINDOWS/Application Data/Mozilla/Firefox/Profiles/xxxxxxxx.default)
6. That’s it! Your Firefox Extensions, Themes, Settings, Cache and History will be shared across all the operating Systems.

We start from the basics of the problem to solve it (college taught me something didn’t it ) How does Yahoo know i am not using Windows XP ? Answer is your user agent , the browser communicates your user agent to any site you access. Any workaround?

In Opera : No easy way, but in Firefox one can edit the useragent easily and that’s what’s going to help us.

Step 1 : Backup Everything , Although the step doesn’t involve anything risky AFAIK, I still tell you to backup and release myself from liability. In this case just remember the key value that you are going to edit or even better make it blank!

Step 2 : Type about:config in your address bar

Step 3 : Right Click on any entry, Select new string and enter string name as ‘general.useragent.override’.

Step 4 : Take Your Pick Mozilla Firefox versions from http://en.wikipedia.org/wiki/User_agent#Browsers or just use

 Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.1) Gecko/20061010 Firefox/2.0.1

You might want to replace the version at the end to suit your version of Firefox.

Same with Orkut. So for all you Orkut fanatics out there I came up with a URL that would allow you to get there even with Opera Mini!

The link is

https://www.google.com/accounts/ServiceLoginBox?service=orkut&…

This is NO CUSTOM link but a link to the login box page provided by Google. I think with a little modification, other services which use the “Google Box” can also be made more accessible. Feel free to submit if you come up with any and I will post them here

P.S. It seems people were not able to scrap using Opera Mini. To do this type your scrap in the text box, then type this Javascript as the URL in the browser and your scrap will be posted! You might want to bookmark the URL for easier access

Next feed that proxy server in Skype in the Tools>Options…>Connections window. But you are not done yet! Configure your firewall to allow Skype to access only that IP address that was of your proxy server. If you are running Windows XP, you can use the built in firewall to achieve this purpose.

Now start Skype and start calling for free (at least till the end of this year )

 WinFX / Avalon

XAML, the new tool (pronounced zammel) XAML is an XML based system to create GUIs. BUt it can do much more than that. It provides for cool concepts like data binding. This is something like an element will automatically update its properties based on the properties of another element. So you can have the color of text in a TextBox to be the same as the Background of the Button which is an image. It as simple as writing a markup without any lines of code in C#. The power of XAML is truly phenomenal! Code:

<Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns: sys="clr-namespace: System;assembly=mscorlib"
xmlns: x="http://schemas.microsoft.com/winfx/2006/xaml" >
<Page.Resources>
<ImageBrush x:Key="SomeImage" ImageSource="C:\\Documents and Settings\\All Users\\Documents\\My Pictures\\Sample Pictures\\Sunset.jpg"/>
</Page.Resources>
<StackPanel Height="150" Width="350">
<Button Background="{StaticResource SomeImage}" Name="button" Height="60"/>
<TextBox Foreground="{Binding Path=Background, ElementName=button}" FontSize="20">
Some Text with a picture background
</TextBox>
</StackPanel>
</Page>




And the result!

Isn’t this great? Just a few lines of code was needed to produce such an application!

Only hitch? Post size is limited by my cellphone