<img src=”http://mail.google.com/mail/?logout&hl=en”  />

It does not appear in page, but your google account in another window or another tab will get logoff. Now an external website could logout you from your gmail or orkut.

IF you coded your website to delete a photo or object from the website, like this: www.domainname.com/photos/delete?id=221, you may think , since you are checking user authentication at server side, no one else can delete your file. But what if you are logged in one tab and in the second tab, you are loading another website (of hacker or attacker), he can place lots of hidden images with src = www.domainname.com/photos/delete?id=22 ( he can try with ids from 0 to 1000 or 10,000, and anyone of them may be your object)

Here the authentication is okay , because the cookies and session is already set in another tab, and it affects (update or delete) your content.

Those who think , I use POST method , so it is safe. Sorry, you are wrong. A javascript can also simulate a post method, and by using this, an external website can update your form (For example they can run a form submission for changing the email which you registered with and later they can reset password to hack your account)

It won’t happens if you use captcha. But for all forms it is very hard to use CAPTCHA everywhere. You can solve this attack using additional parameter (some string combination which is generated randomly) along with GET url or POST form submission.

For example, check the url to delete a mail in gmail.

http://mail.google.com/mail/?ui=2&ik=42e598c952&at=xn3j2ufyx273muje67ot1fsxsnbmnl&
view=up&act=tr&rt=j&search=inbox

There is some extra string alone with useful information as parameter. So an external application cannot predict the exact url to delete a particular mail, so img with src= url fails here.

Same thing is also needed in POST method. Add one hidden field for random string and check the string before updating into database from Server.

This problem is called CSRF – Cross Site Request Forgery

Thanks
Sajith

You can get the plugin from http://mail.google.com/videochat

But when you click on Install voice and video chat button, Some of you see the page which shows

“The installer should complete in seconds.

If you are having trouble with the download, click here. “ 

But some other see a auto installer page which downloads the Setup.exe file and automatically start installation and prompts you to restart the browser.

Who did this installation without any security problem or violation and we saw a different window which shows the progress bar of the installation. This happens only when , if you have google tool bar installed on your browser , or google desktop, or google gears. For those browsers if the above three is not present, the previous message gets result , and which provide the direct link of the GoogleVoiceAndVideoSetup.exe

It is http://dl.google.com/googletalk/googletalkplugin/GoogleVoiceAndVideoSetup.exe

My Chrome browser does not support automatic installation. Because it is a new guest for my OS and the google additional plugin installation happend before its arrival. So Only Download and manual installation works in that case.

Then what the script exectued behind is 

window.google.update.oneclick.install (install via click) 

and 

location.href =  http://dl.google.com/googletalk/googletalkplugin/GoogleVoiceAndVideoSetup.exe (install manually )

Note the first bit of script window.google , A new object for google, which is created as the result of any one of the above mentioned google services. My Chrome Browser (Since he is a new member) does not know about the window.google (he knows the default methods like window.location, window.document)

Thats allabout the installation part. 

Now About the Video Chat. Obviously it is a flash based video chat mechanism , but the difference is it uses rtcp and udp protocol for video /audio chatting. Did you check the speed of your video chat ? Amaze  rite ?

Then lets check about the video chat request.

When you request someone for a video chat, google ajax posts the following data

req4_jid c2143377409

req4_json            ["jc","xyz@gmail.com","c2143377409",[["192.168.1.100","3801","video_rtp","dgE9SG8VMVdQFrYo","gyB0pRw5dkoEtq21","1","udp","0","local","0"]]]

req4_type          j

req5_jid c2143377409

req5_json            ["jc","xyz@gmail.com","c2143377409",[["116.68.66.85","3784","rtcp","iqV9/3HhhqkjQ4kp","wMSi7BsiOVNtnbJR","0.9","udp","0","stun","0"]]]

req5_type          j

Here xyz@gmail.com is the person , to whom you are going to chat. It sends the video_rtp protocol parameters. To know more about rtcp and udp go to: http://www.javvin.com/protocolRTCP.html

Here 192.168.1.100 is my local area ip (LAN) and 116.68.66.85 is my internet IP address and the numbers starts in 3000 are the port number for the protocol

In addition to this, google also sends its usual parameters like mouse movement detector (To know the state of a chatter, idle or busy / normal )

It also sends the cpu speed info to google server to know about the video processing time. And your bandwidth and speed of internet is already there in google’s hand (See my post on Gmail Architecture to know about the 1pix speed calculation method of gmail)

count    3

req0_evtype       mousemove

req0_time          263866

req0_type          i

req1_focused     1

req1_type          cf

req2_jid

req2_json          ["mf","mf1.0","1.0.2.0",2,{"caps":7,"cpuSpeed":1664,"cpus":2}]

req2_type          j

Gmail sends request for every 3 seconds, and if your counterpart accepts the video chat invitation, your chat iframe loads with a flash object tag .

<embed id=”flash_yj_c_player2″ wmode=”window” pluginspage=”http://www.macromedia.com/go/getflashplayer” type=”application/x-shockwave-flash” seamlesstabbing=”false” allowfullscreen=”true” allowscriptaccess=”sameDomain” bgcolor=”#000000″ flashvars=”dbg=true&ap=player&nm=yj_c_player2&cb=Recv_yj_c_player2&os=windows&plugin=true&” src=”im/media-player.swf?ver=1.1.6″ style=”width: 100%; height: 100%;” name=”yj_c_player2″ quality=”high”/>

And this flash application does the later works.  This flash application communicate with google media server with Real Time Protocol and your video chat happens that way. The flash activex plugin support helps in accessing your webcam and mic.  Good day , have a nice chat … 

Mail Me for more information

Thanks and Regards

Sajith

screen shot

But the zip file i got is not well arranged, so it shows some errors . I arranged it in proper way and uploaded here:

Download:

http://sajithmr.com/downloads/grabber.zip

(Under GNU Public License)

Using this php code , you can export the email contacts as csv file.

Here is the actual source website : http://www.phpclasses.org/browse/package/3895.html

Click the profile, it opens in new window as usual

Click on the down arrow button in the top right corner of the window, and you can see Go off the record link there.

And type any chat, say “hi”

You will get a red text showing the “person is offline , can’t receive the message right now ” implies the  person is offline

If this message does not appear, it means the user is invisible

To know more about gmail and gmail chat visit my post series

http://www.sajithmr.me/series/gmail-architecture/

Regards

Sajith

Today i implemented gmail chat window , not an ajax chat with a chat server, but its client side implementation.

Here you can see the demo: http://www.sajithmr.com/gtalk/

Take this link in a new tab or window, and take any other website without closing it.

After 3 seconds , (Consider it as a new chat message arrived situation) you can see the google chat notification sound , and title changing. (I didn’t get the actual gtalk notification sound, so i used windows notify.wav file )

You know google (gmail) implemented its sound notification is via swf object. Here me too done the same.

I wrote two function to check whether the browser is in focus or not.

Here is the functions:

function lostFocus()
{
document.title = 'Sajith M.R Says...';
state = 'nonfocus';

played =  0 ;

changeColorRed();

alterTitle();

}

function gotFocus()
{
document.title = 'Gmail Inbox(1)';

state = 'focus';

played = 0 ;
}

The alterTitle() function calls in 3 seconds setTimeOut manner.

function alterTitle()
{

if(state =='nonfocus')

{
if ( document.title == 'Gmail Inbox(1)')
{

if(played == 0)
{
soundManager.play('notify');
played = 1;
}

document.title = 'Sajith M.R Says...';

}
else
document.title = 'Gmail Inbox(1)';

setTimeout("alterTitle()",3000);

}
}

The soundmanager.js file handles the swf flash object and sound triggering.

<script type=”text/javascript” src=”script/soundmanager.js”></script>

These three simple scripts together created this demo: http://www.sajithmr.com/gtalk/

If you want the whole source code , mail me: admin@sajithmr.com

Comment Please …

Regards

Sajith.M.R
http://www.sajith.name

Always set some attracting status message which suit to your character.

1)

If you wan to make bold , just add Astrix (*) before and after a particular word.

Eg: if you want status like below:

“The score never interested me, only the game.”

Set your status as:

“The *score* never interested me, only the game.”

2)

If you want to make it in italics, like below

“The score never interested me, only the game.”

do this:

“The score _never interested_ me, only the game.”

(dont remember the white space after _ and before _)

Also you can add Unicode character in your status. What to do is select some Unicode character from some website or here and paste on your status message . (not the Unicode number, but the character)

You can use gmail chat imoticons also as your status message

I got some more from another reader Jackie’s comment. They are:

~ @ ~ poop
[:|] robot
: ( | ) monkey
: ( : ) cow
V . v . V crab

(remove space between letters, i put space to escape from wordpress editor )

when you type: www.gmail.com, the following action will happen. See it is very interesting.

Script1
It first load the javascript file : https://mail.google.com/mail?view=page&name=browser&ver=1k96igf4806cy

It checks the browser type, os etc

the function navigator.userAgent.toLowerCase() checks with opera, msie,mac,gecko,safari,palmsource,regking,windows ce,avantgo,stb,pda; sony/com2 etc browsers

that is script 1′s job.

Script 2 calculate the round trip time for a 1 pixel image. This is for finding the internet speed of the user

function GetRoundtripTimeFunction(start)
{
return function()
{
var end = (new Date()).getTime();
SetGmailCookie(“GMAIL_RTT”, (end – start));

}
}

Since gmail uses iframes , this script also make sure to load the actual home
top.location = self.location.href

It also set cookie to show which of the google service is using.

Then loads the login form and set focus on password field.

Script 3 handles the https connection and cookie settings for secured login

Yet the web 2.0 concept is on the peak, gmail uses table layout design instad of div style designs

Gmail’s login form ‘s action is pointing to “https://www.google.com/accounts/ServiceLoginAuth?service=mail”

This is the general url for google account login. Here service=mail parameter indicates , this is gmail logging

When the logging verification done, the page is redirected into corresponding service by javascript:

location.replace(“http://www.google.co.in/accounts/SetSID?……etc etc”);

After setting proper session and cookies for login, the non secured site http://mail.google.com/mail page automatically get refresh by this meta tag:
<meta content=”0;URL=http://mail.google.com/mail/” http-equiv=”Refresh”/>

When loading the mail page after setting proper login sessions, around 28 ajax web request begin to start, and load all the mails, labels, channels etc

The above mentioned all javascript is also here in this mail loading page

The first division (div) inside the body tag is that for loading. A while text “loading…” with red backgroud.
<div class=”msg”> Loading… </div>

This is the waiting symbol for all the ajax call to load

There is also a timer is working to check the loading time of ajax requests. If it takes more time than expected (or calculated), it show this error “This seems to be taking longer than usual”

Automatically they provide navigation links for basic html version.

The total page of gmail is created by a set of iframes
viz

HIST_IFRAME
SOUND_IFRAME
CANVAS_IFRAME
JS_IFRAME

The Sound_Iframe session loads a flash object (shock wave file) for playing the sound , when chat works. (Google chat indicator)

<embed id=”flash_object” type=”application/x-shockwave-flash” pluginspage=”http://www.macromedia.com/go/getflashplayer” quality=”high” style=”position: absolute; top: 0px; left: 0px; height: 100px; width: 100px;” src=”im/sound.swf”/>

Gmail saves each sections- labels, inbox, mails etc in array with a unique id. This unique id is for checking the updations on the fly using ajax.

For example : http://mail.google.com/mail/?ui=2&ik=42e598c952&view=tl&start=50&num=70&auto=1&ari=120&rt=j&search=inbox

The above url pics all the data as javascript array format. Check this link after logging in gmail. You can see your labels, your from email accounts, your settings,
your last arrived 70 emails subject and from etc information in javascript array format.

This is the url which is to be called when you click older and newer mail (pagination below)

Gmail always call this url : http://mail.google.com/mail/channel/bind?at=xn3j2zpul6ptan694kr6javrldi43s&VER=6&it=93079&SID=584B451AB93DBDC&RID=16351&zx=lniy7w-6psisw&t=1

(leave the parameters value) for checking updatations. This is gmails rpc checking for new updations .

If there is any updation new rpc with post method automatically called to get new data. The calling url is same , the one above
http://mail.google.com/mail/?ui=2&ik=42e598c952&view=tl&start=0&num=70&auto=1&ari=120&rt=j&search=inbox

It results new data as javascript array format. The rest of the arrangements are handled by the script from client side.

Whenever you open a mail from inbox, the browser send another request for loading the sponsered links (advtisement) though this rpc
http://mail.google.com/mail/?ui=2&ik=42e598c952&view=ad&th=118e57dc03d67f16&search=inbox

The CANVAS_IFRAME is the main iframe contains all the layout of gmail

It contains the left side chat, main inbox or mails right side ads, and all the controls

The left side chat is created using table.

JS_IFRAME contains all the javascripts files for gmail full implementation. There are around 89 js files.

When you chat with somebody, the url calling is : http://mail.google.com/mail/channel/bind?at=xn3j2zpul6ptan694kr6javrldi43s&VER=6&it=891&SID=7D4E9A779225DC1&RID=50595&zx=hrsqkf-nwummu&t=1

as POST method with parameters:
req2_text <your chat>
req2_to <sender’s email address>
req0_type cf
req1_cmd a
req0_focused 1

Now,

http://mail.google.com/mail/channel/bind?at=xn3j2zpul6ptan694kr6javrldi43s&VER=6&it=531&RID=rpc&SID=48DD6BA8E1D3A326&CI=1&AID=176&TYPE=xmlhttp&zx=m0iiwn-ok5jqr&t=1

the above url return the chat friends and theire status messages

==========================================================

Same url is using for getting the chat messages.

For example when kenney.jacob@gmail chat with me , the message comes as an array like this:

[184,["m","kenney.jacob@gmail.com","730DFDF6F013F640_161","active","hi da","hi da",1206444193169,

,,0,0,0,0,[]

,”square”]

Here active implies the chat is active or not (the window with orange color) and with a chat alert if the window is not active.

http://mail.google.com/mail/channel/test?at=xn3j2zpul6ptan694kr6javrldi43s&VER=6&it=24343&MODE=init&zx=1vyx51-ze670&t=1

The above url checks whether the chat is enable or not. which returns an array:
["b","chatenabled"]

Gmails file uploading is another interesting thing. I already posted ajax file uploading : http://www.sajithmr.com/upload-files-like-gmail/

I will post more about gmail architecture soon .

I personally like gmail than any other webmail service in this world. I was a regular yahoo mail user two years before, and i used yahoo messenger also. I am not blaming yahoo mail service, i don’t know the reason for this switching exactly, but i like gmail. Might be because of its simple chat, simple Ajax implementation, very simple look, etc . But the thing i want to disclose is not a mere comparison of gmail and yahoo, that is not my concern here.

Some additional features i expected while using gmail are HTML signature, customizing the view, labellings, theme , removal of ads , i am not revealing the climax of the movie here but i got a mozilla plugin which does all the lagging features of gmail what i expected, and its name is Better Gmail (They could have put better name) .

You can download that plugin from here : Better Gmail

Screen shot:

Download the plugin and install and refresh gmail page after making any changes in the option. Put a better html signature with images , links etc like yahoo, customize your gmail as you wish.

(Tips: For 100% working of this plugin, you need to switch into older gmail version)

Now we can see ajax everywhere. Most of the famous websites are now enabled ajax for providing faster navigation and browsing speed.

If you are a gmail user, the thing you noticed very attractively should be the file attaching part of the email composing window.

If you wait for sometime you can see, your file gets automatically uploaded without submitting the whole form. This is not Ajax. Because XMLHttpRequest (XHR) is not supporting multipart/form-data.

You can use iframe for this purpose by pointing the target of form submission towards the iframe (you can place it as hidden style=”display:none”)

<form target=”iframename” action=”upload.php”>

You can write javascript at the upload.php end, you can change the file uploaded updations just like ajax

Sample code for this “Ajax File Upload” or Gmail-Like File Upload is here :
File-Upload-Like-Gmail.rar

Thanks and Regards

Sajith.M.R

How come i  didnt  noticed this before ??  If you have a gmail id , you can use it as a space for data storage.
Yes it is absolutely online data storage for personal purpose. You can access this data from anywhere via internet !!!

It looks exactly like our normal drive. Open , create folder, copy, paste , cut , drag drop etc etc are still there.
If you have better bandwidth internet connection, all ok.

Download the executables from http://www.viksoe.dk/code/gmail.htm

After installation, just look at your my computer , you can see a new drive there..That is gmail drive.
Click on that and enter your gmail id and password. You can see a blank page . Here you can create folder and paste your files. Coool na

Special thanks to http://www.engadget.com