Building WAP-enabled Applications with JBuilder Application WAP-enabled Applications with JBuilder...

BuildingWAP-enabledApplicationswith JBuilder™

and Inprise™

ApplicationServer™

Adding WAP clients as an additionalpresentation layer into enterpriseapplications.

by Giles Davies, Inprise/Borland UK

Introduction

This document demonstrates how to provide WAP access

into an enterprise application, in this case using EJB™ in

the business logic layer.

The intent is to demonstrate how WAP clients can be

developed with JBuilder™ to provide another client

presentation layer onto existing or new enterprise

applications.

Table of ContentsIntroduction 1

Summary 2

WAP Overview 3

The WAP Application 4

Resources 11

Appendix 12

Fig 1. The portfolioscreen from theexample application.

JBu ilder

JBuilder

2

Glossary

Acronym Description

DTD Document Type Definition

EJB Enterprise JavaBean™

HTML Hyper Text Markup Language

HTTP Hyper Text Transfer Protocol

IAS Inprise™ Application Server™

IP Internet Protocol

JSP Java™ Server Page

JWS Java Web Server™

MIME Multi-purpose Internet Mail

Extensions

SSL Secure Socket Layer

TCP Transmission Control Protocol

UDP User Datagram Protocol

URL Uniform Resource Locator

WAP Wireless Application Protocol

WML Wireless Markup Language

WSP Wireless Session Protocol

WTLS Wireless Transport Layer Security

WTP Wireless Transport Protocol

XML eXtended Markup Language

Summary

It is projected that by the end of 2002, there will be as

many people accessing the Internet by handheld devices

as by desktop computers. Beyond 2002, the numbers of

people accessing the Internet by handheld devices will

increase dramatically, and start to put desktop access in

the minority. For many people, their first, and perhaps

only, meaningful interaction with the Internet may be via

handheld devices, such as mobile phones, PDAs, or their

successors.

WAP is therefore going to be an increasingly important

means of delivering services to end users. Developers,

architects, and business managers need to provide WAP

access into their enterprise applications to compete

effectively.

WAP presents several opportunities:

• A new channel for existing services.

• The scope for an entirely new set of services that

capitalize on the mobile paradigm.

• Access to a much larger user base

This document demonstrates the building of an enterprise

application, based around a fictional bank, which offers

financial services to its customers via a variety of

interfaces, from the native desktop applications of its

employees, to both Web- and WAP-based access.

In the process, it is intended to show that WAP is another

presentation layer, and that a well designed system, with

the business logic layers separated from the presentation

layers, can incorporate a WAP interface without needing

to reengineer the business logic.

The WAP client places a number of restrictions on the

developer, primarily concerning the limited display

characteristics of today’s devices. Being aware of these

issues is important in deciding what services can be made

available.

This document will briefly overview WAP as a

technology, before walking through writing the example

application, using Java® servlets built using Borland®

JBuilder™ 3.5.

WAP Overview

What is WAP?

WAP is the Wireless Application Protocol. It is an open

standard designed to allow users of mobile/handheld

JBuilder

3

devices to gain access to the Internet as easily as they can

make telephone calls, send SMS messages, and so on.

There are limitations with the current range of WAP

devices. As we shall see, going to the Internet via a WAP

device is a different experience from accessing the

Internet via a traditional Web browser on a desktop

computer. Nevertheless, there are great possibilities for

services via WAP.

Who’s behind WAP?

WAP is the product of the WAP Forum

( www.wapforum.org ), an association founded in 1997 by

Ericsson, Motorola, Nokia, and Phone.com (formerly

Unwired Planet). The WAP Forum now has over 200

members and represents over 95 percent of the global

handset market.

The primary goal of the WAP Forum is “to bring together

companies from all segments of the wireless industry

value chain to ensure product interoperability and growth

of wireless market.”

WAP Architecture

WAP consists of a number of protocols, which are

analogous to the protocols required by “normal” HTTP

Web communication.

Layer WAP Web

Application Layer Wireless

Application

Environment

(WML and

WMLScript)

HTML, Scripting

languages

Transport Layer WSP, WTP, WTLS

and WDP

HTTP, SSL, TCP,

UDP

Network Layer Bearer IP

In addition to these protocols, there are some additional

elements required by WAP, including:

• A microbrowser. Used by the WAP device to render

the WML and/or WMLScript to the user.

• A WAP Gateway. This can provide integration and

routing facilities.

When a WAP device is used, the user enters a URL into

the device’s microbrowser by either using a bookmark or

typing the URL, as with Web browsers. This URL may be

routed via a WAP Gateway, which can then either return

WML from the target URL or, if appropriate, pass HTML

through an HTML filter to return WML to the WAP device.

HTML

Filter

URL URL

WML

(Compiled)

WML

HTML

WAP

Gateway

Target HostWAP Device

JBuilder

4

Fig 2. High-level overview of WAP communication.

A frequently asked question is whether a WAP Gateway

is necessary. A WAP Gateway essentially allows full

integration into a Service Provider’s facilities, which could

include:

• Personalization services, such as online customization

of the user’s bookmarks, which are then updated on

the WAP device.

• Integration into enterprise services such as e-mail or

security.

It is not therefore a requirement that a WAP Gateway be

used, as WML can be accessed from the WAP device

directly from a normal Web server. Note that it may be

necessary to set up the WAP MIME types in the Web

server, which will be covered later in this document.

WML

The Wireless Markup Language is XML-based, defined in

an XML DTD. For example, the DTD for WML 1.1 is

http://www.wapforum.org/DTD/wml_1.1.xml. WML

supports text, images, user input, option lists, hyperlink

navigation, and unicode.

The good news is that WML is very like HTML. Many of

the tags are the same, and familiarity with HTML enables

fast learning of WML.

The bad news is that WML is very like HTML—similar

enough to be familiar, but with sufficient differences to

be initially frustrating! For example, all tags must be

completed, something that is less strictly enforced in

HTML. Similarly, all tags must be in lower case, rather

than in the mixture of cases that HTML permits.

WML also has a few, more fundamental structural

differences from HTML, reflecting the different

environment that the microbrowsers operate in; namely,

a WAP device’s screen is small and typically

monochrome. These differences, in conjunction with a

download capability of 9600 kbps, provides a solution by

WML that is of a deck of cards. The basic concept, is

that a number of screens’ worth of data (the cards) are

downloaded together in one file (the deck). This helps

overcome issues of network latency that might otherwise

impose relatively lengthy delays for each small screen’s

worth of WML. Navigation between cards and decks is

achieved using <href> hyperlinks, as with HTML. As well

as having the cards, it is also possible to provide a

template in the deck, which can be used to provide one

or more options on every card. A typical example is to

provide a “back” option so that the user can return to the

previous screen.

Fig 3. WML’s deck of cards.

The WAP Application

Objectives

This sample application is designed to:

1. Illustrate WAP functionality.

2. Demonstrate how WAP clients can access enterprise

services.

CardCard

CardTemplate

Card

CardCard

JBuilder

5

3. Demonstrate that WAP clients can be added as “just”

another presentation layer into applications.

Scenario

For this example, the supposed scenario is as follows:

MBank, a hypothetical bank, wants to allow their

customers to:

• view their account balances, and

• view the current stock values in their portfolio

via either the Web or from a WAP device.

For these purposes, the back end business logic is

provided via EJBs hosted in Inprise™ Application Server™

4.0 (IAS 4), and access into the EJBs is achieved via a

presentation server layer of servlets run in Java Web

Server, as supplied with IAS 4.

Fig. 4. Schematic diagram of the example application.

Develop the business logic

The first step is to develop the business logic that actually

represents the customer’s accounts and portfolio. In this

example, this layer is kept deliberately simple in order to

concentrate on the presentation layers.

Two EJBs were written; a Container Managed Persistence

Entity Bean representing an account, and a Stateful

Session Bean representing processes available to a

customer, in this case supporting account balance queries

and stock portfolio updates.

These EJBs were built using JBuilder 3.5 following these

steps for each EJB:

1. Create the EJB using the EJB wizard.

2. Add the methods required into the bean class itself.

3. Run the EJB Interfaces wizard to generate the Home

and Remote Interfaces as well as the XML EJB

Deployment Descriptor.

4. Complete the EJB Deployment Descriptor.

5. Package the EJB(s) into a JAR file using the

Deployment Wizard.

6. Deploy the JAR file to the EJB container using the EJB

Deployment Wizard.

For a full breakdown of the steps required in writing EJBs

using JBuilder 3.5, see:

http://www.borland.com/devsupport/appserver/faq/jbuil

der/JBuilderEJB.htm .

Develop the HTML servlet

The next step is to develop the HTML servlet in order to

provide Web-based access into the application.

The framework for the servlet was first generated using

the JBuilder servlet wizard. This was used to create a

servlet class called AccountSummary that extends

HttpServlet and implements the doGet() method.

JBuilder

6

This generates the following class:

•

AppCenter is a visual tool that allows you to define

the complex relationships between the many

components that make up your distributed

application.MONITOR the operation and status of your

application,

The generated code in the doGet() method now needs

to be replaced with our implementation. The first step is

for the servlet to find the home interface for the cashier

session bean, and obtain a reference to the EJB Object, in

order to invoke the relevant methods available on the

remote interface.

Once a reference to the EJB object is available, the servlet

simply queries the cashier for the account balances and

portfolio values, and incorporates that data into the HTML

being returned in the output stream.

In this servlet, the account balances and the portfolio are

displayed inside an HTML table, with the time that the

data is correct displayed at the top.

The first lines of code set the background color to black

and the text to white, as well as displaying the time:

AppCenter monitors these applications by providing:

a repository for application configuration and

package example.mbank.gui;

import javax.servlet.*;

import javax.servlet.http.*;

import java.io.*;

import java.util.*;

public class AccountSummary extends HttpServlet{

//Initialize global variables

public void init(ServletConfig config) throws

ServletException{

super.init(config);

}

//Process the HTTP Get request

public void doGet(HttpServletRequest request,

HttpServletResponse response) throws

ServletException, IOException{

PrintWriter out = new PrintWriter

(response.getOutputStream());

response.setContentType("text/html");

out.println("");

out.println("The servlet has received a GET. This is

the reply.");

out.println("");

out.close();

}

}

// Obtain the initial JNDI context

javax.naming.Context initialContext = new

javax.naming.InitialContext();

// Get the object by name from the initial context

Object objref =

initialContext.lookup("examples/mbank/cashier");

// Narrow the reference to the home object

CashierHome home = (CashierHome)

javax.rmi.PortableRemoteObject.narrow(objref,

CashierHome.class);

// Obtain a reference to the EJB Object

Cashier cashier = home.create();

out.println("<body bgcolor=\"#000000\"

text=\"#FFFFFF\">");

out.println("MBank Account Summary");

out.println("All

information is correct as at "+dateString+"");

out.println("Account Balances:");

JBuilder

7

Next, a table is created with the account balances

obtained from the Cashier EJB:

The next part of the method iterates through the portfolio

HashMap, adding each stock into a new row of the

second HTML table:

With the method implemented the servlet can be tested

inside JBuilder by running the AccountSummary.shtml file

created by the servlet wizard:

Fig. 6. Running the HTML servlet in JBuilder

Develop the WML Servlet

The WML servlet is very similar to the HTML servlet. WAP

uses HTTP, so the WML servlet can extend the

HttpServlet class just as the HTML servlet does.

The first step in writing the WML servlet is to use the

JBuilder servlet wizard to create the class and the stubs

for any methods to be used. The WML servlet class in this

example is called wmlservlet, and, for clarity, only

implements the doGet() method.

Exactly as with the HTML servlet, a reference to the EJB

object needs to be obtained, so that the relevant methods

can be called to populate the WML with data. All the

following code has been located inside the doGet()

method.

Since this servlet is going to be returning WML, it is

important to set the MIME type for the response to WML:

// Account balances table

out.println("<table width=\"75%\" border=\"1\">");

out.println("<tr>");

out.println("<td>Account</td>");

out.println("<td>Balance</td>");

out.println("</tr>");


out.println("<td>Current</td>");

out.println("<td>"+curBalance+"</td>");



out.println("<td>Savings</td>");

out.println("<td>"+savingsBalance+"</td>");


out.println("</table>");

Iterator keys = portfolio.keySet().iterator();

while (keys.hasNext())

{

String key = (String) keys.next();

String value = (String) portfolio.get(key);


out.println("<td>"+key+"</td>");

out.println("<td>"+value+"</td>");


}

JBuilder

8

This alerts the browser to the type of content being

returned, so that it can treat it in the most appropriate

way—in this case to treat it as WML.

In order to form the WML correctly, the next step is to

declare the XML type and DTD:

The WML document itself can now be started using the

<wml> tag:

Next, the deck of cards needs to be created. The first, but

optional, step here is to include a template section:

The <do> tag allows the association of specific actions

with the command buttons on the WAP device. The

above template uses the <do> tag with the known type of

“prev”, which the microbrowser uses to take the user

back to the previous screen. The label attribute is simply

a text string, and is placed above the relevant button on

the device, as shown below:

Fig. 7. Association of an action with the WAP devicebutton

Now the cards in the deck need to be written. Each card

is of the format:

The <card> tag requires a unique id and a display title.

The unique id is used in referencing the card for a link,

as we shall see later. Note that any text to be displayed

needs to be enclosed inside a … tag.

The first card in this deck is:

response.setContentType("text/vnd.wap.wml");

out.println("<?xml version=\"1.0\"?>");

out.println("<!DOCTYPE wml PUBLIC \"-

//WAPFORUM//DTD WML 1.1//EN\" \"

http://www.wapforum.org/DTD/wml_1.1.xml\">");

out.println("<wml>");

… (deck of card goes here)

out.println("</wml>");

out.println("<template>");

out.println("<do type='prev' label='Back'>");

out.println("<prev/>");

out.println("</do>");

out.println("</template>");

out.println("<card id='cardid' title='CardTitle'>");

out.println("");

out.println("Some text etc");

out.println("");

out.println("</card>");

out.println("<card id='Welcome' title='Main Menu'>");

out.println("");

out.println("Welcome to ");

out.println("MBank. ");

out.println("The time is now: ");

out.println(dateString + " ");

out.println("<a href='#accounts'>Accounts</a> ");

out.println("<a href='#portfolio'>Portfolio</a> ");

JBuilder

9

Which looks like this:

Fig. 8. The welcome card from the deck.

Fig. 8. The welcome card from the deck

There are a few points to note here:

1. Notice that even though the card above contains only

six lines, the user still has to scroll down to the links

to the other cards!

2. Data, in this case simply the current time, can be

concatenated into the WML string, just as with HTML

servlets.

3. There are two links, the syntax of which is the same

as using HTML anchors, but these refer instead to

other cards in the same deck.

The other two cards in the deck are very similar. The

accounts card is written in this way:

Fig. 9. The accounts card

Here, the account balances, which have been retrieved

from the cashier EJB object, are simply returned in the

card.

The portfolio card uses the same technique as in the

HTML servlet, iterating through the portfolio HashMap:

out.println("<card id='portfolio' title='Portfolio'>");

out.println("");



{



out.println(key+": "+value+" ");

}



out.println("<card id='accounts' title='Accounts'>");

out.println("");

out.println("Current Account ");

out.println(curBalance+" ");

out.println("Savings Account ");

out.println(savingsBalance+" ");

JBuilder

10

Fig. 10. The portfolio card

During the development process JBuilder can be used to

run the WML servlet, just as you can with the HTML

servlet. The output from the servlet is displayed, which,

although not rendered in the same way as via a WAP

device, does allow the output from the servlet to be

verified:

Fig. 11. Running the WML servlet within JBuilder

The entire source code for the WML servlet can be found

in the Appendix to this document.

Deploying the servlets

The servlets can be now be deployed. In this case the

Java Web Server installed with IAS 4 was used. (Note that

it is possible to plug in the Web server/Servlet/JSP engine

of your choice. See

http://www.borland.com/appserver/papers/11499_apache

.pdf for details on using Apache and JServ with IAS 4, as

an example.)

For JWS the steps are:

1. Copy the servlets into <IAS Install Dir>\classes.

This is the default servlet classpath for JWS in IAS 4.

2. Add the servlets to JWS using the web adminstration

tool.

By default this is available on http://localhost:9090 .

Select Manage HTTP Web Engine, then select

Servlets and Add. For each of the servlets supply a

name and the fully qualified class.

3. Add aliases for the servlets (so that they can be called

from a link, etc.)

Running the application

Having deployed the servlets, it’s time to try running the

servlets. For the HTML servlets a dummy web site was

created with a link to the aliased servlet.

For the WAP servlet the most effective test harness is to

use a WAP emulator. There are several emulators

available; the one being used for this document is the

Nokia WAP Toolkit, which is available from

www.forum.nokia.com . The Nokia emulator is free of

JBuilder

11

charge, but does require that you register. Another free of

charge emulator can be found at www.phone.com .

Using the Nokia WAP Toolkit:

• Select Go | Load Location

• Enter the URL to the WML servlet alias, e.g.:

http://localhost:8080/mbank.html

The servlet will then be loaded and the output displayed

in the displayed phone, from which the buttons can be

used to navigate the WML.

Setting WAP MIME types

In the WML servlet, the MIME type is set in the response.

However, if you want your Web server to be able to treat

all WAP MIME types correctly you may wish to add the

following MIME types to your Web server:

wml = text/vnd.wap.wml

wbmp = image/vnd/wap/wbmp

wmlc = application/vnd.wap.wmlscript

wmls = text/vnd.wap.wmlscript

wmlsc = application/vnd.wap.wmlscriptc

Check your Web server’s documentation for how to add

these MIME types. For JWS, they can be added through

the Web Administration interface, then select Manage the

Http Web Engine, then select MIME Types, and just type

them in as entries in the list.

Resources

A summary of the links referred to in this document, as

well as some additional related links:

Borland® JBuilder™

http://www.borland.com/jbuilder/

Using JBuilder for EJB development

http://www.borland.com/devsupport/appserver/faq/jbuil

der/JBuilderEJB.htm

Inprise™ Application Server™

http://www.borland.com/appserver/

http://www.borland.com/devsupport/appserver/faq/

http://www.borland.com/appserver/papers/

WAP

http://www.wapforum.org

WAP Emulators

http://www.forum.nokia.com/main.html

http://developer.phone.com/

JBuilder

12

Appendix

A – WML Servlet source

package wapexample;

import javax.servlet.*;

import javax.servlet.http.*;

import java.io.*;

import java.util.*;

import java.text.DateFormat;

import wapexample.*;

public class wmlservlet extends HttpServlet

{

//Initialize global variables

public void init(ServletConfig config) throws

ServletException

{

super.init(config);

}

//Process the HTTP Get request

public void doGet(HttpServletRequest request,

HttpServletResponse response)

throws ServletException, IOException

{

String curBalance = null;

String savingsBalance = null;

HashMap portfolio = null;

try

{

// Obtain the initial JNDI context

javax.naming.Context initialContext =

new javax.naming.InitialContext();

// Get the object by name from the initial context

Object objref =

initialContext.lookup("examples/mbank/cashier");

// Narrow the reference for RMI/IIOP

CashierHome home = (CashierHome)

javax.rmi.PortableRemoteObject.narrow(objref,

CashierHome.class);

Cashier cashier = home.create();

curBalance = cashier.getCurBalance();

savingsBalance = cashier.getSaveBalance();

portfolio = cashier.getPortfolio();

}

catch (Exception ex)

{

System.out.println("Exception: "+ex);

}

PrintWriter out = response.getWriter();

DateFormat timeFormat =

DateFormat.getTimeInstance();

String dateString = timeFormat.format(new Date());

response.setContentType("text/vnd.wap.wml");

out.println("<?xml version=\"1.0\"?>");

out.println("<!DOCTYPE wml PUBLIC \"-

//WAPFORUM//DTD WML 1.1//EN\" \"

http://www.wapforum.org/DTD/wml_1.1.xml\">");

out.println("<wml>");

out.println("<template>");

out.println("<do type='prev' label='Back'>");

out.println("<prev/>");

out.println("</do>");

out.println("</template>");

out.println("<card id='Welcome' title='Main Menu'>");

out.println("");

out.println("Welcome to ");

out.println("MBank. ");

out.println("The time is now: ");The issue is, or

course, how do you measure this, and a fair amount of

effort was expended in order to make these things

out.println(dateString + " ");

JBuilder

13

out.println("<a href='#accounts'>Accounts</a> ");

out.println("<a href='#portfolio'>Portfolio</a> ");



out.println("<card id='accounts' title='Accounts'>");

out.println("");

out.println("Current Account ");

out.println(curBalance+" ");

out.println("Savings Account ");

out.println(savingsBalance+" ");



out.println("<card id='portfolio' title='Portfolio'>");

out.println("");



{



out.println(key+": "+value+" ");

}



out.println("</wml>");

}

}

Copyright © 2001 Inprise Corporation. All rights reserved. All Inprise and Borlandbrands and product names are trademarks or registered trademarks of InpriseCorporation. Java is a trademark or registered trademark of Sun Microsystems, Inc. inthe U.S. and other countries. CORBA is a trademark or registered trademark of ObjectManagement Group, Inc. in the U.S. and other countries. 11659

100 Enterprise WayScotts Valley, CA 95066-3249www.borland.com | 831-431-1000 | Fax: 831-431-4113

Building WAP-enabled Applications with JBuilder Application WAP-enabled Applications with JBuilder...

Documents

Transcript of Building WAP-enabled Applications with JBuilder Application WAP-enabled Applications with JBuilder...