Embedding Apps into Web Pages with ActiveX Controls - Terminal Services for Windows Server 2003

In order to illustrate how the system works when you embed applications into a web page, we first need to review the components that make up this system.

In order to illustrate how the system works when you embed applications into a web page, we first need to review the components that make up this system. Then, we can look at how they work together to deliver applications to your users.

Web Embedded Application Components

Three primary components are used when embedding remote Terminal Server applications into a web page.

  • Web server hosting the RDW.
  • Terminal Servers to host the applications.
  • Active X Client.

Component 1. Web Server

You web server is obviously the primary interface for users in this environment. After all, the whole purpose is to allow users to access their server desktops through the web, and this is done with the web server. The ActiveX control we're discussing here works with IIS servers version 4.0 and later, (although if you're looking to use another web server you can use custom pages and the client described later in this chapter).

Component 2. Terminal Servers

A Terminal Server or a cluster of Terminal Servers must be available to accept the inbound connections and host the applications. The Terminal Servers host the users' RDP sessions after the user launches a connection. When a user clicks a link to launch a session, the user's session starts on Terminal Server just like any other session. In fact, there is no difference in a user's session whether he launches it from Web page or from a regular client.

Component 3. ActiveX Control

When embedding Terminal Server applications directly into web pages, a Microsoft ActiveX control replaces the full desktop RDC client. This ActiveX control is called the "Remote Desktop Connection Web Connection," or simply "RDW." (The RDW client replaces the "Terminal Server Advanced Client" that you may remember from a few years ago.)

The RDW ActiveX control provides virtually the same functionality as the full Remote Desktop Connection client, but is obviously designed to be used in a web browser for connections over the Web. When embedded in a Web page, the client connects to a Terminal Server session, even if the full Remote Desktop Connection client is not installed on the user's computer.

You can install this client on any Windows 2003 IIS Server. (Add/Remote Programs | Add/Remote Windows Components | Application Server | Internet Information Services | World Wide Web Service | Remote Desktop Web Connection) You can also download it for free from Microsoft.com.

When you install the RDW ActiveX control on an IIS server, a minimal set of sample web pages are also installed. These pages include default and connection pages that work together to create a terminal server web connection.

How the Remote Desktop Web Connection Client Works

Now that you understand the components that make up an RDW environment, let's look at how they all work together to deliver embedded applications to your end users.

Figure 11.1 shows the various RDW components and the processes that take place in the environment. Read through the steps while referring to the diagram.


Figure 11.1: How the remote desktop web connection client works

  1. A user with a web browser requests the web page by typing in a URL.
  2. The web server sends down the HTML login page via the HTTP protocol.
  3. The web server checks to see if the user has the full RDC or the ActiveX control RDW client installed.
  4. If not, or if the version installed is older than the version in the CAB file, the ActiveX control is downloaded, decompressed, and installed.
  5. The web page is displayed in the client's browser.
  6. The user enters a server or connection name and screen resolution and clicks "connect."
  7. The ActiveX control running on the client workstation passes the startup parameters to the Terminal Server, and a session is launched.

In this case, the RDP session is running on the client device via the ActiveX control (which is also running on the client device). Once the session is running, the web server is no longer required. Even though it's in a browser, the RDW client is connected directly to the Terminal Server.

The RDW Installation Process

Installing the RDW is easy. Run the tswebsetup.exe package that you downloaded. This "installation" process is nothing more than an "unzipping" process that unzips some files into a folder of your choosing. Most people choose to unzip these files into a folder called "TSWEB" underneath their "wwwroot" folder.

There are only a few files contained in the zip. The main one is msrdp.cab. This cabinet file is only 304kb in size. It contains the actual ActiveX control (msrdp.ocx) and an INF file (msrdp.inf) that helps get the ActiveX control installed on client workstations. In addition to the CAB file, the main zip file also contains a sample web page (default.htm) and some supporting graphics. (To see what it looks like, just browse over to www.brianmadden.com/tsweb.)

Customizing the Default RDW Web Page

This default page leaves something to be desired. It's not at all configured for your Terminal Servers. At this point a user could technically use the web client, but he would be required to type in the name of the server or cluster he wishes to connect to.

When using the embedded RDW client, most people choose to customize the web page to make it simpler for the end user. Let's look at some different ways to customize the ActiveX client pages:

  • Preconfiguring a server name.
  • Selecting client features to be used.
  • Embedding the RDW client into your own web pages.

Preconfiguring the Server Name and Resolution

Instead of keeping the default page and training users to type in a server name, you can preconfigure the web page so that the connection name (or names) are already in the HTML. This alleviates helpdesk calls when users can't remember the name of their connection. You can also change the list of available screen resolutions or even force all users to use a single resolution (useful if you want to force all users to connect in full screen mode).

To do this, edit the default.htm page with any HTML editor, although notepad is adequate for the simple edits you'll be doing here. When you open default.htm in your editor, search for the following section:

<!-- Column 3 -->
    <td id="ServerNameKeyWidth" style="width:10%;"
         <label id=ServerNameKey accessKey="S"
         <br><p align="right">&nbsp;<ID

<!-- Column 4 -->
      <td id="ServerKeyWidth" width="40%"
      <br>&nbsp;&nbsp;<input type="text" name="Server"
size="41" id="editServer">

<!-- Row 2 -->

<!-- Column 3 -->
<td valign="middle">
<p align="right"><label id=sizeKey accessKey="Z"
for="comboRes" class="sizespace"><ID
<!-- Column 4 -->
<td valign="bottom">&nbsp;&nbsp;<select size="1"
name="comboResolution" id=comboRes class="topspace">
<option selected value="1"><ID id=option1>Full-
<option value="2"><ID id=option2>640 by
<option value="3"><ID id=option3>800 by
<option value="4"><ID id=option4>1024 by
<option value="5"><ID id=option5>1280 by
<option value="6"><ID id=option6>1600 by
            </select> </label>

The code in the first section labeled "Column 3" creates the text field where users enter their server names. This field can easily be changed into a dropdown list with multiple entries for various servers, much like the resolution selection in the section labeled Row 2 Column 4. (A sample of a server dropdown list is available at www.brianmadden.com/tsweb/serverlist. Feel free to visit that page and "view source" to steal the code and do it yourself.)

Notice all the "option value" entries towards the end of this section of HTML code. These entries represent the options that the user may select which choosing the resolution. If you don't want any of the resolutions, then simply delete the option. Or, if you want to force all users to use the same resolution (by removing the resolution dropdown box altogether), visit www.brianmadden.com/tsweb/resolution and steal the code yourself.

Selecting Client Features to be Used

In addition to customizing the options that are visible to users via the web page, you can also edit the default.htm file to specify which advanced client functions are used. You can enable or disable client drive mapping, printer mapping, port redirection, and smart card redirection all by editing some simple HTML.

Simply open default.htm in your text editor and search for the following lines of code. Then, adjust the TRUE or FALSE settings accordingly, and you're all set.

MsRdpClient.AdvancedSettings2.RedirectDrives     =
MsRdpClient.AdvancedSettings2.RedirectPrinters   =
MsRdpClient.AdvancedSettings2.RedirectPorts      =
MsRdpClient.AdvancedSettings2.RedirectSmartCards =

Embedding the RDW Client into any Web Page

Rather than using the sample default.htm web page, you can instead embed the RDW ActiveX control in any page you want. This is no different from embedding an ActiveX control in any web page (which is easy for developers).

Just insert the following <OBJECT> into the <HTML> section of your web page.

<OBJECT ID="MsRdpClient"

This sample code sets the embedded session to run at 800x600 resolution. There are additional parameters that you can pass to the msrdp.ocx ActiveX control. The easiest way to get a full list is to open the OCX with a utility from Visual Studio such as OLEview.


Dig Deeper on Terminal Services and Remote Desktop Services