Introduction
When you want to access your yahoo mail account, you go to mail.yahoo.com, type in your user name and password and click "Sign In" button. You can select Remember my ID on yahoo to save typing user name but still this is too much of work. If you switch to a different machine you will have to do it again. In this article, I will show you how to add a toolbar to Internet Explorer which will navigate to your favorite Web site(mail.yahoo.com) and do the login for you. Copying some files to other machine will add the toolbar buttons on other machine as well.
Background
Basic framework for this tutorial for adding toolbar to Internet Explorer is copied from Pavel Zolnikov's article on band objects. I suggest you to read this article to understand BandObjects and how you can add Explorer Bar /Toolbar to Internet Explorer. I extended his SampleBar to add auto-login functionality.
Using Toolbar
You can either use the setup.exe for setting up the toolbar on your machine or you can download the source code and build the project. Once you have this toolbar in IE, you can navigate to your favourite website for which you want single click login, say mail.yahoo.com.
- Click on Customize button of the toolbar which will bring up a Customize form with all the links, and controls in this website.
- In Button Title/Tooltip edit control, enter for the button title for this website, say xyz@yahoo.
- In the list box, you will see the entry login. Select it and enter your login name in value edit control and select Add button (Action for entering your username).
- Select passwd and enter your password and select Add button (Action for entering your password).
- Select Sign In and select Add button (Action for clicking on Sign In button).
- Select Ok button to make this button entry to IE toolbar.
Now whenever you click on this button, first IE will navigate to mail.yahoo.com and login in with above login details. The user name, password you entered are kept in an XML file in C:\IE AutoComplete directory. This is a simple text file so username and password are not protected, please don't use this toolbar for your banking websites. I have not added any encryption to it but if you want to modify the source code, then do it.
To remove any button entry from the toolbar, delete the respective file from C:\IE AutoComplete directory. To add these same entry to other computer just copy this directory contents. Toolbar reads all the files in this directory to create configurated buttons.
Using the code
- I used Extending Explorer with Band Objects using .NET and Windows Forms to create a user control which will host IE toolbar. I modified Pavel Zolnikov 's SampleBars.sln. In
HelloWorld
class, button1
is replaced with a ToolBar control myToolBar
.
- Reference to Microsoft.mshtml.dll is necessary to access
HTMLDocumentClass, HTMLAnchorElementClass, IHTMLInputElement
. Also put the following lines at the beginning of HelloWorldBar.cs: using mshtml;
- A Customize button is added to this toolbar. The click event of this toolbar will iterate through active document to collect all the links, buttons, and input boxes on page.
Explorer.Document
is instance of currently loaded HTMLDocumentClass
.
(HTMLDocumentClass)Explorer.Document;
Two classes ItemType
and ButtonEntry
are defined in Interface.cs file. ItemType
class instance is used for item details on a webpage. ButtonEntry
class is used to read/write customized XML button entry data to file system. All these HTMLAnchorElementClass
and HTMLInputElementClass
objects are added to customize Items
' ArrayList of type ItemType
. Customize form is displayed for user input.
private void onCustomize(object sender, System.EventArgs e)
{
Customize frm = new Customize();
frm.URL = doc.url; int count = -1;
foreach(object o in doc.all)
{
try
{
count++;
if( !(o is IHTMLElement))
{
continue;
}
IHTMLElement elem = (IHTMLElement)o;
if(elem.id == null)
{
if(o is HTMLAnchorElementClass)
{
try
{
HTMLAnchorElementClass aElem = (HTMLAnchorElementClass)o;
string id = aElem.outerText;
string itemInfo = "outterText";
if(id == null)
{
id = aElem.href; itemInfo = "href";
}
frm.Items.Add(new ItemType("link",id,itemInfo));
}
catch(Exception )
{
sp;
{
}
continue;
}
}
if(o is IHTMLInputElement)
{
HTMLInputElementClass btn = (HTMLInputElementClass)o;
try
{
if(btn.type != null)
{
string type = btn.type.ToLower();
if(type=="submit" || type == "button" || type == "radio"
|| type == "checkbox" || type == "text"
|| type == "password" )
{
string id = btn.id;
string itemInfo = "id";
if(id == null)
{
id = btn.id; itemInfo = "id";
}
if(id == null)
{
id = btn.name; itemInfo = "name";
}
string defaultVal = btn.defaultValue;
if(defaultVal != null)
{
defaultVal = defaultVal.Trim();
if(defaultVal == "")
{
defaultVal = id;
}
}
frm.Items.Add(new ItemType(type,id,itemInfo,defaultVal));
continue;
continue;
}
}
}
catch(Exception )
{
};
}
}
}
catch(Exception )
{
}
}
if(frm.ShowTheDialog() == DialogResult.OK)
{
addBtn(frm.myButtonEntry);
};
}
return;
}
- On any other button click (xyz@yahoo), if active page is different than mail.yahoo.com, then mail.yahoo.com is loaded. Values are set for all the controls, and any submit button action is invoked to login to particular website.
private void myToolBar_ButtonClick(object sender,
System.Windows.Forms.ToolBarButtonClickEventArgs e)
{
if(myToolBar.Buttons.IndexOf(e.Button) == 0)
{
onCustomize(null,null);
return;
}
ButtonEntry btnEntry = (ButtonEntry)e.Button.Tag;
onButtonClick(btnEntry);
}
protected void onButtonClick(ButtonEntry frm_in)
{
HTMLDocumentClass doc = (HTMLDocumentClass)Explorer.Document;
if(frm_in.myURL != doc.url)
{
try
{
doc.url = frm_in.myURL;
}
catch(Exception )
{
return;
}
Explorer.DocumentComplete+=
new SHDocVw.DWebBrowserEvents2_DocumentCompleteEventHandler(
Explorer_DocumentComplete);
myPendingReqest = frm_in;
return;
}
foreach(ItemType it in frm_in.myArrayLst)
{
if(it.Type == "text" || it.Type == "password" )
{
try
{
HTMLInputElementClass ele = (
HTMLInputElementClass)doc.getElementById(it.Name);
ele.value = it.Val;
}
catch(Exception )
{
}
}
else if(it.Type == "radio" || it.Type == "checkbox" )
{
try
{
HTMLInputElementClass ele =
(HTMLInputElementClass)doc.getElementById(it.Name);
ele.@checked = Convert.ToBoolean(it.Val);
}
catch(Exception )
{
}
}
else if(it.Type=="submit" || it.Type == "button")
{
try
{
HTMLInputElementClass ele =
(HTMLInputElementClass)doc.getElementById(it.Name);
ele.click();
}
catch(Exception )
{
}
}
}
}
Pavel Zolnikov's article shows the important part of adding IE toolbar. This article adds feature to modify the IE functionality. As you can see, Accessing/modifying HTML page content from client side is very simple and easy.