The Express Way to the Internet

By: John Kaster

Abstract: John K had some time and space on a recent flight, so he wrote a quick overview of Delphi 5's InternetExpress.

The Express Way to the Internet

I'm flying back to California from the meeting last night with the Houston, Texas Delphi User Group, where I was showing off some of the cool new features of Delphi 5. One of the many new features the user group members found very interesting is InternetExpress, which is introduced in Delphi 5 Enterprise. The Dallas user group members last Saturday were just as interested in it. Since I was able to get an exit row seat and had the room to use my laptop, I thought I'd put together a quick overview of InternetExpress and point out some existing demos that ship with Delphi 5 so you can see for yourself how well InternetExpress works.

InternetExpress makes browser-based clients for distributed database applications very easy to develop. These browser-based applications are extremely flexible, and can provide far more powerful capabilities than people expect in browser-based clients. Although InternetExpress itself is new in Delphi 5, it is a natural evolution of the work begun with the initial release of MIDAS in Delphi 3.

A Quick History Lesson

MIDAS 1 (development support released in Delphi 3 Client/Server) made the development of Windows-based thin-clients easy. MIDAS 2 (development support released in Delphi 4 Client/Server) made Java-based clients possible with its support for Corba as a transport, and the MIDAS Client for Java. One of the many things we introduced in MIDAS 3 is XML data packets, which makes MIDAS data packets part of an open standard. Even better, it makes them self-documenting and human readable. More on this later.

InternetExpress uses MIDAS 3's XML data packet support. It also employs Borland's unique implementation of XML support via JavaScript. By providing our XML support in JavaScript, InternetExpress can run in any browser that supports JavaScript and DHTML. I have used InternetExpress clients in Netscape 4.05 and up, and Internet Explorer 4.01 and up. If you find browsers that do not support it, let me know. I'd like to keep a list. The main reason I make a point to mention this is because InternetExpress gives you a competitive advantage by providing XML support in browsers other than Internet Explorer 5. All other XML implementations I have seen for distributed data, including Microsoft's and Oracle's, require IE 5.

If you are using IE 5, InternetExpress will dynamically generate a page optimized for it. Our JavaScript file xmldom.js will not be included in the HTML page, and the XML will be declared within an XML island.

Our JavaScript support for the DOM specification allows you to create data-aware HTML clients with conventional web servers by developing a Delphi-based NSAPI/ISAPI, ASP (much easier to develop with Delphi 5 because of our support Active Server Object wizard), or CGI executable that will marshall the data requests and updates to the MIDAS server that provides the initial data packets and resolves the changes (deltas).

Go with the flow

If you are new to web-based programming, this may sound a bit confusing, but as Dr. Evil might say, "It's quite simple, really." Here's a step-by-step flow of what happens with InternetExpress:

  1. The browser connects to the URL specifying the InternetExpress ASP, ISAPI, NSAPI, or CGI executable.
  2. The InternetExpress executable (the server) provides an HTML page back to the browser, usually a starting page or query form.
  3. The user makes a request via the browser for some data on which to work.
  4. This request is passed back to the server, which processes the request and generates another HTML page. This HTML page contains references to the JavaScript that supports MIDAS 3's XML datapackets. It also includes the JavaScript that defines the JavaScript object that will handle the XML data packet provided by the MIDAS server.
  5. After the page is received, the browser client will request the XML datapacket from the server.
  6. The user can now browse through the local data set, adding, deleting or changing records, including master-detail records.
  7. After all changes are made to the data, the user clicks the "Apply Updates" button to send the changed data back to the server.
  8. The server accepts the XML delta datapacket and uses the MIDAS server to resolve the data changes back to the database.
  9. If you have added a TReconcilePageProducer to your server, it will also automatically handle conflict resolution. If a data conflict is detected because the data you send back to the server as your original record doesn't match what is currently on the server, or the record you're attempting to edit no longer exists, the server will send a different browser client back to the user, so they can manually resolve the changes. Of course, you can also handle the data conflicts yourself on the MIDAS server.

Component Architecture

If you look at it abstractly, the InternetExpress web components use HTML as an API much like some of the visual VCL components use the Windows API for display and editing. HTML has edit boxes, comboboxes, checklist, buttons, and more. The InternetExpress components generate the HTML code necessary to display their information and allow it to be edited if such an operation is supported.

The InternetExpress components help you create all the 'plumbing' and nesessary databindings, as well as some of the presentation aspects of the data in the browser. Once the presentation layer is created, it can be further refined with any HTML-tools. The binding to the HTML happens only through the names of the HTML input objects, and their events.

TCustomMidasPageProducer is what produces the HTML that makes the browser-based client. It does this by requesting the content from each component it, in turn, contains. If some of those are containers as well, they request content from the web components they contain. Here is the declaration of TCustomMidasPageProducer:

TCustomMidasPageProducer = class(TPageItemsProducer, IWebContent, IWebComponentEditor,
  IScriptProducer)

The Interface for a given component is queried to determine if it can be used by this PageProducer descendent. If a component has the IWebContent interface, it can be used to produce content in this producer. Here is its declaration.

IWebContent = interface
['{1B3E1CD1-DF59-11D2-AA45-00A024C11562}']
  function Content(Options: TWebContentOptions;
    ParentLayout: TLayout): string;
end;

There are some additional interfaces that may be implemented by a component, like IWebContent, IHTMLForm, or IWebComponent shown here, if the component contains additional web components, like a layout group or data grid.

IWebComponent = interface
  ['{EB813782-EEAE-11D2-AFB0-00C04FB16EC3}']
  function GetIndex: Integer;
  procedure SetIndex(Value: Integer);
  procedure SetContainer(Container: TWebComponentContainer);
  function GetContainer: TWebComponentContainer;
  procedure SetComponentList(List: TObject);
  property Index: Integer read GetIndex write SetIndex;
  property Container: TWebComponentContainer read GetContainer 
    write SetContainer;
  property ComponentList: TObject write SetComponentList;
end;

A WebModule is used for building your server application. If you haven't seen it before, it's actually a descendent of a TDataModule with some extensions specific to writing Web server applications and providing HTML pages or other data to a browser-based client. To start building your InternetExpress server, drop a TMIDASPageProducer on the form.

If you right mouse click on the TMIDASPageProducer, you will see a menu option for the Web Page Editor. The Web Page Editor queries the interface for the components to determine which ones to display in its "add component" popup menu.

More Cool Web Components

There are additional InternetExpress components in the Delphi/Demos/MIDAS/InternetExpress/InetXCustom directory. To install them:

  1. open the dclinetxcustom.dpk package in Delphi 5.
  2. Double click on the required package InetXCustom.dpk.
  3. Double click on the source file LinkFlds.pas.
  4. Go to line 44 and copy the line of code that says property KeyFieldName; in the declaration of TLinkColumn into the clipboard.
  5. Paste it into the published section of TFieldLink, around line 55.

After you install the package, TReconcilePageProducer can be found on your InternetExpress tab, and many additional web components will be available in the Web Page Editor.

The InetXCenter Tutorial/Demo

I talked Jim Tierney (the primary developer of the InternetExpress components) into giving a talk at the Borland Developer's Conference in Philadelphi in July of 1999. Not only did he give the talk, he actually produced his presentation for it using InternetExpress, and that demonstration system is included with the Delphi 5 Enterprise install in your Delphi/Demos/MIDAS/InternetExpress/InetXCenter directory.

He produced the tutorial late in the development cycle of Delphi, so our publications team didn't have time to document the new components he created. Because of this, they are not installed by default into Delphi 5 Enterprise. You can install these additional components yourself by opening the inetxcentercomponents.dpk in Delphi 5 and installing it.

There are additional installation details in the readme.txt file included in the InetXCenter directory. Please be sure to follow them closely so you can correctly run the InetXCenter tutorial.

Tip: When you are following the instructions in the readme.txt file, you may want to make your InetXCenter directory your virtual web directory to skip having to copy the files to a new location, or modifying the output directory for the various components of the system.

Using the Tutorial

To use the tutorial, all you need to do is run the server rdminetxcenter.exe once to make it self-register, then reference the CGI application in your browser. I named my virtual directory netx, so the URL I use to bring up the virtual directory is http://localhost/netx/inetxcentercgi.exe. I use the CGI version of the server rather than the ISAPI version so I could make changes to it more conveniently. Microsoft IIS (Internet Information Server) caches ISAPI DLLs for performance reasons, so once you start one in the web server, replacing it with a modified version becomes problematic.

Tip: I recommend this technique for any web server extension you're writing, so that you can quickly make changes to it while it's being developed and debugged. Once you're done with the changes, change it to an ASP or ISAPI dll by using the exact same unit after running the Active Server Object or Web Module wizard. Also, I use Netscape when testing the web server because it handles localhost correctly when you're disconnected (IE doesn't) and it doesn't "protect you" from the actual text of the error messages generated by the server like IE does by default. Marc Hoffman reminded me of the menu option for enabling the display of original error messages in IE. Simply un-check the "Show friendly HTTP Error Messages" option on the Advanced tab of the Internet Explorer options dialog. (Thanks, Marc!)

Once you have the tutorial running, you can click on the various links to read detailed information on all aspects of InternetExpress, including XML, the InternetExpress components and their architecture, the JavaScript libraries, and also run the examples.

JavaScript implementation

Here's the information in InetXCenter on the JavaScript files. To learn more about XML (much more), you should go to the World Wide Web Consortium's web site on XML. Our JavaScript implementation conforms to the consortium's ECMA script language binding specification.

Library Functions
xmldom.js This library is a DOM-compatible XML parser written in javascript. It allows parsers that do not support XML to use XML datapackets (XML Islands are supported by IE5 only).
xmldb.js This library defines data access classes that manage an XML datapacket and XML delta packet.
xmldisp.js This library defines classes that associate the data access classes in xmldb.js with HTML controls in the HTML page.
xmlerrdisp.js This library defines classes that are used to process reconcile errors. These classes require an XML delta packet and an XML error packet.
xmlshow.js This library includes functions to open windows displaying formatted XML data packets and XML delta packets.

To use these JavaScript files, they simply need to be included as scripts in the HTML client source code. Here's what these inclusions look like in one of the sample InetXCenter implementations:


<SCRIPT language=JavaScript type="text/javascript" SRC="../xmlshow.js">

</SCRIPT>
<SCRIPT language=JavaScript type="text/javascript" SRC="../xmldom.js">

</SCRIPT>
<SCRIPT language=JavaScript type="text/javascript" SRC="../xmldb.js">

</SCRIPT>
<SCRIPT language=JavaScript type="text/javascript" SRC="../xmldisp.js">

</SCRIPT>

This text is insterted automatically with InternetExpress into the HTML client.

Back to Earth

The plane's about to land, so I'm going to wrap this article up. Next time, we'll talk about the XML data packets, how they're structured, how the delta works, how the browser uses them, and how you can see it for yourself with the sample InetXCenter applications. If you can't wait that long, I invite you to ask questions in the MIDAS newsgroup.

For another InternetExpress article, click here.


Server Response from: ETNASC02