JBu ilder. Building WAP-enabled Applications with JBuilder and Inprise Application Server. Introduction

Transcription

1 Building WAP-enabled Applications with JBuilder and Inprise Application Server 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. Fig 1. The portfolio screen from the example application. Adding WAP clients as an additional presentation layer into enterprise applications. by Giles Davies, Inprise/Borland UK Table of Contents Introduction 1 Summary 2 WAP Overview 3 The WAP Application 4 Resources 11 Appendix 12 JBu ilder

2 Glossary Acronym DTD EJB HTML HTTP IAS IP JSP JWS MIME SSL TCP UDP URL WAP WML WSP WTLS WTP XML Summary Description Document Type Definition Enterprise JavaBean Hyper Text Markup Language Hyper Text Transfer Protocol Inprise Application Server Internet Protocol Java Server Page Java Web Server Multi-purpose Internet Mail Extensions Secure Socket Layer Transmission Control Protocol User Datagram Protocol Uniform Resource Locator Wireless Application Protocol Wireless Markup Language Wireless Session Protocol Wireless Transport Layer Security Wireless Transport Protocol extended Markup Language 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. 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. 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 therefore going to be an increasingly important means of delivering services to end users. Developers, 2 WAP is the Wireless Application Protocol. It is an open standard designed to allow users of mobile/handheld

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. Layer WAP Web Application Layer Wireless Application HTML, Scripting languages Environment (WML and WMLScript) Transport Layer WSP, WTP, WTLS and WDP HTTP, SSL, TCP, UDP Network Layer Bearer IP Who s behind WAP? WAP is the product of the WAP Forum ( 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. 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. WAP Device WAP Target Host WAP Architecture URL Gateway URL WAP consists of a number of protocols, which are analogous to the protocols required by normal HTTP WML (Compiled) WML HTML Web communication. HTML Filter 3

4 WML also has a few, more fundamental structural 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 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. 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. WML The Wireless Markup Language is XML-based, defined in an XML DTD. For example, the DTD for WML 1.1 is 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. Card Card Fig 3. WML s deck of cards. Card Card Card Card Template The WAP Application 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. Objectives This sample application is designed to: 1. Illustrate WAP functionality. 2. Demonstrate how WAP clients can access enterprise services. 4

5 3. Demonstrate that WAP clients can be added as just another presentation layer into applications. Scenario 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. 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. 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: 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. Fig. 4. Schematic diagram of the example application. Develop the business logic 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. 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. 5

6 This generates the following class: 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("<font COLOR=GREEN>"); out.println("the servlet has received a GET. This is AppCenter is a visual tool that allows you to define the reply."); the complex relationships between the many out.println("</font>"); components that make up your distributed out.close(); 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. // 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(); 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: out.println("<body bgcolor=\"#000000\" text=\"#ffffff\">"); out.println("<p><font face=\"comic Sans MS\" size=\"6\">mbank Account Summary</font></p>"); out.println("<p><font face=\"comic Sans MS\">All information is correct as at "+datestring+"</font></p>"); AppCenter out.println("<p><font monitors these face=\"comic applications Sans by MS\" providing: size=\"5\"><b>account a repository for application Balances:</b></font></p>"); configuration and 6

7 Next, a table is created with the account balances obtained from the Cashier EJB: // Account balances table out.println("<table width=\"75%\" border=\"1\">"); out.println("<tr>"); 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 out.println("<td><font face=\"comic Sans MS\">Account</font></td>"); out.println("<td><font face=\"comic Sans MS\">Balance</font></td>"); out.println("</tr>"); out.println("<tr>"); out.println("<td>current</td>"); out.println("<td>"+curbalance+"</td>"); out.println("</tr>"); out.println("<tr>"); out.println("<td>savings</td>"); out.println("<td>"+savingsbalance+"</td>"); out.println("</tr>"); out.println("</table>"); The next part of the method iterates through the portfolio HashMap, adding each stock into a new row of the second HTML table: 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. Iterator keys = portfolio.keyset().iterator(); while (keys.hasnext()) String key = (String) keys.next(); String value = (String) portfolio.get(key); out.println("<tr>"); out.println("<td>"+key+"</td>"); out.println("<td>"+value+"</td>"); out.println("</tr>"); 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: 7

8 response.setcontenttype("text/vnd.wap.wml"); Fig. 7. Association of an action with the WAP device button 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: out.println("<?xml version=\"1.0\"?>"); out.println("<!doctype wml PUBLIC \"- //WAPFORUM//DTD WML 1.1//EN\" \" The WML document itself can now be started using the <wml> tag: out.println("<wml>"); (deck of card goes here) out.println("</wml>"); Next, the deck of cards needs to be created. The first, but optional, step here is to include a template section: out.println("<template>"); out.println("<do type='prev' label='back'>"); out.println("<prev/>"); out.println("</do>"); out.println("</template>"); 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 Now the cards in the deck need to be written. Each card is of the format: out.println("<card id='cardid' title='cardtitle'>"); out.println("some text etc"); 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 <p> </p> tag. The first card in this deck is: out.println("<card id='welcome' title='main Menu'>"); out.println("welcome to<br/>"); out.println("mbank.<br/>"); out.println("the time is now:<br/>"); out.println(datestring + "<br/>"); out.println("<a href='#accounts'>accounts</a><br/>"); out.println("<a href='#portfolio'>portfolio</a><br/>"); the device, as shown below: 8

9 Which looks like this: Fig. 9. The accounts card Here, the account balances, which have been retrieved 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: out.println("<card id='accounts' title='accounts'>"); out.println("current Account<br/>"); out.println(curbalance+"<br/>"); out.println("savings Account<br/>"); out.println(savingsbalance+"<br/>"); 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'>"); Iterator keys = portfolio.keyset().iterator(); while (keys.hasnext()) String key = (String) keys.next(); String value = (String) portfolio.get(key); out.println(key+": "+value+"<br/>"); 9

10 The entire source code for the WML servlet can be found in the Appendix to this document. 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 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 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 Add the servlets to JWS using the web adminstration tool. By default this is available on 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 The Nokia emulator is free of 10

11 charge, but does require that you register. Another free of charge emulator can be found at Using the Nokia WAP Toolkit: Select Go Load Location Enter the URL to the WML servlet alias, e.g.: 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. Resources A summary of the links referred to in this document, as well as some additional related links: Borland JBuilder Using JBuilder for EJB development der/jbuilderejb.htm 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 Inprise Application Server WAP WAP Emulators 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. 11

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"); 12 // 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\" \" 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("welcome to<br/>"); out.println("mbank.<br/>"); out.println("the time is now:<br/>");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 + "<br/>");

13 out.println("<a href='#accounts'>accounts</a><br/>"); out.println("<a href='#portfolio'>portfolio</a><br/>"); out.println("<card id='accounts' title='accounts'>"); out.println("current Account<br/>"); out.println(curbalance+"<br/>"); out.println("savings Account<br/>"); out.println(savingsbalance+"<br/>"); out.println("<card id='portfolio' title='portfolio'>"); Iterator keys = portfolio.keyset().iterator(); while (keys.hasnext()) String key = (String) keys.next(); String value = (String) portfolio.get(key); out.println(key+": "+value+"<br/>"); out.println("</wml>"); 100 Enterprise Way Scotts Valley, CA Fax: Copyright 2001 Inprise Corporation. All rights reserved. All Inprise and Borland brands and product names are trademarks or registered trademarks of Inprise Corporation. Java is a trademark or registered trademark of Sun Microsystems, Inc. in the U.S. and other countries. CORBA is a trademark or registered trademark of Object Management Group, Inc. in the U.S. and other countries