Creating Interactive Web Pages

Today’s fast-paced manufacturing environment demands that you use all tools available to keep up with the competition and emerging technologies. With the Internet changing the way you do your job, have you looked at how it can help your test system?

In today’s world where manufacturing test systems often run on multiple machines, the Internet and web provide a means to easily connect them. Also, remote access to measurement and test data is a requirement in today’s systems, and publishing information to web pages simplifies distribution.

Two basic methods of adding web functionality to your test application are by serving static pictures of your application to web pages and by creating a client-server architecture for fully interactive communications. The particular requirements of your application will help you determine which type of web-enabled system is best suited for you.

Web Server

Some of today’s measurement or test-ready programming environments have a built-in web server. This server automates the task of showing data via the Internet and takes snapshots of the front of your application to post them to a web page. The server automatically updates the image at a predetermined interval so all you have to update is your web page to get the latest information.

You also can do this yourself by creating a server common gateway interface (CGI) script. This is a small program that you have to write. It resides on the web server and takes snapshots of the front of your application to translate into a web page-the same as a built-in server.

This type of web interaction is useful for publishing data across the web so that others in your organization can view the measurements as they happen. This interaction also enables you to monitor a process or test system from another computer. Through the web, you then can troubleshoot problems from your office and devise appropriate action plans before you go to the manufacturing floor.

Client-Server Application

Another way to communicate between different applications over the Internet is to create a client-server-type application. To do this, you use a server that takes data from the measurement source, be it an instrument or data acquisition board. The client applications subscribe to the data on the server. The server then publishes the data to all of the client applications as soon as data becomes available.

With the use of ActiveX technology and Microsoft Internet Explorer, the client application can be embedded inside a web page, providing a complete web-based client. Because the code on the page is running completely on the client machine, you can make truly interactive test-ready web pages with fast response times to user interaction.

Usually this process requires more programming because you create a smart server application and a smart client application. You also have to program the data transfer method, usually TCP/IP. This approach gives you extra functionality such as complete two-way data transfer for acquisition and control of a test system through a web page. Software packages that simplify the creation of a client-server web application are available.

HTML and ActiveX

The web is written in Hypertext Markup Language (HTML). Today, with the advances in HTML and web editing tools, you do not have to write the code. Web-page creation now is a drag-and-drop process with the code created underneath.

ActiveX is built on the foundation of the Component Object Model (COM) architecture from Microsoft, a set of software requirements for connecting software code modules even if they originated from different developers. You can fit ActiveX controls into web pages by embedding them in your HTML code.

Previously, this was a difficult task because you had to know COM internals, such as controls class ID. With today’s tools, you can easily create a web page by dropping in the control you want to use or by having a tool create a web page using the control. Since Internet Explorer has the capability to use ActiveX controls and now is available for many different countries with support for more than 20 languages, you can use ActiveX-based web applications worldwide.

Creating and Packaging an ActiveX Control

A large base of programming tools is available for creating ActiveX controls. The two most popular are Microsoft Visual C++ and Microsoft Visual Basic. With the latest version of these tools, you are almost completely abstracted from creating an ActiveX control. You just choose the ActiveX Control when developing a new project (Figure 1, see below).

After selecting the correct project type, you just create your client application as usual. For a code sample, go to https://www.evaluationengineering.com/pctest/
. There is no need to add code to implement the application as a page unless you are connecting to a database or a measurement server for live data interaction.

After you create the ActiveX control, put it on a web page. A tool for this, called the Package and Deployment Wizard, comes with Microsoft Visual Studio (Figure 2). The wizard takes you through the process of creating a web page with an embedded control. It automatically handles dependencies and component licensing issues and automatically finds and includes run-time engines and supporting Dynamic Link Libraries (DLL).

The wizard lets you mark the controls safe for scripting which allows them to run in pages. It also simplifies the task of making your newly created application available on the web by automating the distribution to a web server. For a complete walkthrough of the process of creating a web page, go to https://www.evaluationengineering.com/pctest/articles/


There are many benefits to using the web for interactive client-server web-based applications. With the distribution model completely removed, there is no need for anyone to install any software on his or her desktop machine. The web browser already has the functionality required for the application to work. You just create a web client, and then anyone can use the application.

There also is no need for redistributing software updates because anytime someone visits the page, they will download the latest version of the software. The client also will automatically check for the latest version of the control and only download it if needed, making the page load faster and more automatic. After you add functionality to the web page, anyone who accesses that web page also will have the new functionality.

One of the most important benefits of using the web for your test application is that you can create worldwide data visualization and control. You will have the ability to view test information or control your test system from any computer in the world.

About the Author

Jeff Laney joined National Instruments as an applications engineer and currently is the product manager for Measurement StudioT. He holds a B.S. in chemical engineering from Texas A&M University and is a member of the National Society of Professional Engineers. National Instruments, 11500 N. Mopac Expressway, Austin, TX 78759, (800) 258-7022, e-mail: [email protected].

Return to EE Home Page

Published by EE-Evaluation Engineering
All contents © 2000 Nelson Publishing Inc.
No reprint, distribution, or reuse in any medium is permitted
without the express written consent of the publisher.

February 2000

Sponsored Recommendations


To join the conversation, and become an exclusive member of Electronic Design, create an account today!