MS Internet Explorer + ActiveX = A Platform for Rich Web Application

Sunday, 31 July 2011

12089 Hits

Some of us may have heard that using the ActiveX components in Microsoft IE is a bad idea. The overall system design has a very bad reputation. This notion makes sense because there’s a real hole within the security system of a user’s local computer. If you change the security level in IE (allow create and execute ActiveX components) then your system can be compromised and some random code can be executed on your system.

However, this risk could be controlled. In IE, you can create a list of “trusted” sites and apply your special security settings only to this list of sites. In other words, you allow ActiveX component only when you visit one of the trusted sites. Moreover, you can set up and control these security settings by using your company’s security group policies.

The firm’s intranet sites with corporate Web applications are the most probable candidates to be included into the list of “trusted” sites. If you control IE security settings and use ActiveX in your Web application on a “browser” side, it gives you a really powerful tool to create rich Web applications.

ActiveX can be used as a bridge between your Web application and software or even hardware on your workstation.

Basically, you can do the following from your Web application pages:

Create some ActiveX automation servers which already installed on users computer and use them “in background” (i.e. Word, Excel, Outlook or some accounting software if it provides ActiveX automation)
Insert your own ActiveX components by using <OBJECT> tag into your own web pages. You can embed ActiveX installed locally or place them on your corporate web site (in this case you will get automatic and centralized deployment of all your ActiveX components).
Embed in your page ActiveX controls as part of GUI of your Web application
Use of any preinstalled system ActiveX components like FileSystemObject or WSH

Let’s say I have some Web-application for order management purposes and I have a very specific task: I need to print shipping labels on a thermal printer (Zebra) connected to my workstation. I can’t use JavaScript like “window.print()” because my labels are in a ZPL format. I can get my shipping labels in formats like GIF or PNG but it is almost impossible to fit them on my thermal printer. Also, I don’t want to play with the print preferences in my browser and provide users with instructions on how to setup these printing settings for their thermal printers. ZPL format contains special commands for thermal printer which I should send to my thermal printer by “spooling” them to LPT port. If I try to print or send the file to Zebra, the erroneous file will simply cause headaches to technical support. The thermal printer is indeed a very specific device that we should work with very carefully. The only function which a thermal printer can do perfect is executing commands of a print language like ZPL. Sounds fantastic, right?

Let’s use ActiveX in our web page and script it for our purposes.

The first thing I need to do is change the settings in my IE to use ActiveX >> go to IE internet options, select “Security” tab, select “Trusted Sites”, press button “Sites”, then add your corporate site with Web application. Then press “Custom Level” and enable ActiveX in IE, this will enable ActiveX in IE for only your corporate site.

My IE is now ready to display pages from my Web application which now becomes a ‘rich’ with content because I can do everything on the user’s local computer and I can do it from the web page simply using JavaScript and ActiveX automation.

Let’s say our thermal printer is shared on a local machine as: \\my_computer\my_thermal_printer.

I will then need to execute the simple command line to map my local LPT port to this shared printer as: net use lpt1: \\my_computer\my_thermal_printer

Then, I would need to create a small .bat file for this operation as a part of initial setup in the future.

Afterwards, if I spool something to LPT1, it will be sent to my Zebra thermal printer. Let’s create one small function in JavaScript and assign it to onclick event of button (with id “print_label”) on my Web page:

$('#print_label').click(function() {

var fso = new ActiveXObject("Scripting.FileSystemObject");

var lpt1 = fso.CreateTextFile("LPT1:", false);

lpt1.WriteLine("ZPL command 1");

lpt1.WriteLine("ZPL command 2");

lpt1.WriteLine("ZPL command 3");

lpt1.Close();

});

That’s it. When I press “Print Label”, my script writes the commands to system output device with name “LPT1” and then magic happens. The thermal printer interprets these commands and starts printing my shipping labels.

Here I am using special JavaScript object ActiveXObject to create instance of ActiveX with ProgID=Scripting.FileSystemObject. As we often use Internet Explorer and ActiveX, it makes it possible to work with special devices right from the Web page.

I could also take things further by integrating my Web application with a locally installed electronic scale or with something really specific like a finger print scanner. I only need to have an appropriate ActiveX as an interface to these devices and then I can work with it from JavaScript.