cc/td/doc/solution/sesm/sesm_317
hometocprevnextglossaryfeedbacksearchhelp
PDF

Table of Contents

SESM Web Development Overview

SESM Web Development Overview

This chapter provides an overview of a Cisco Subscriber Edge Services Manager (Cisco SESM) system and a Cisco SESM web application—the SESM web portal. It also provides a high-level look at the web components and techniques used to develop a Cisco SESM web application.


Note   Most information in this guide concerns web development for the Cisco SESM web portal. In addition, the "Captive Portal Web Solution" section on page 4-24 provides web development information on the Captive Portal solution web applications. For information on other SESM applications such as the RADIUS Data Proxy (RDP) application, see the Cisco Subscriber Edge Services Manager Installation and Configuration Guide.

Cisco SESM System

Cisco SESM is an extensible set of applications for providing on-demand services, service management, and subscriber management to the broadband, wireless LAN, and mobile wireless markets. Cisco SESM is part of a Cisco solution that allows subscribers of DSL, cable, wireless, and dial-up to simultaneously access multiple services provided by different Internet service providers, application service providers, and Corporate Access Servers.

Cisco SESM allows a service provider to create a customized web application that provides a branded web portal for individual subscribers. Through the Cisco SESM web portals, subscribers can have simultaneous access to the Internet, corporate intranets, gaming, and other entertainment-based services. After logging on and being authenticated to the system, subscribers access their own personalized services by pointing and clicking.

Depending on the SESM software that is used, a deployed SESM web application can be configured for one of two modes:

A Cisco SESM web application allows each subscriber to:

A Cisco SESM system includes one or more SESM servers running one or more Java 2 Enterprise Edition (J2EE) web servers.

The Cisco SESM system components (Figure 1-1) can include the Cisco Service Selection Gateway (SSG), a Cisco IOS software feature module that is available on the Cisco 6400, 7200, and 7400 platforms. Cisco SSG works in conjunction with SESM to provide a number of features such as the prepaid billing feature. The HTTP Redirect feature of the SSG works with an SESM Captive Portal web application.

Figure 1-1 shows an SESM configuration with the components for an LDAP-compliant directory implementation including:


Figure 1-1: SESM System Components


For detailed information on SESM system components, see the Cisco Subscriber Edge Services Manager Solution Guide.

Cisco SESM Web Applications

A Cisco SESM web application is a collection of associated web resources that can include JavaServer Pages (JSP), servlets, utility classes, static documents (such as HTML or WML files), images, and other data. An SESM web application includes:

Three-Tiered Web Application

From a development perspective, a Cisco SESM web application has three tiers:

Figure 1-2 illustrates this three-tiered perspective.


Figure 1-2: Three-tiered SESM Web Application


The interactions between an SESM web application and the back-end components are implemented with a set of specialized SESM programming interfaces. Many of these interactions are preprogrammed in the JSP pages and are configurable by the SESM deployer. The functionality of the preprogrammed JSP pages can be modified or extended by the service-provider's developer. Because no extensive Java programming is required, SESM web development can be completed in a much shorter period of time.

Web Development Roles

For the service provider, SESM web development involves two distinct roles:

The SESM software provides components and techniques for the customization and localization of the web pages. The web designer and web developer determine what customization is needed and use the SESM components and techniques to modify the JSP pages and other SESM components in the required manner.

Sample Cisco SESM Web Applications

A complete sample Cisco SESM web application is included with the SESM software: New World Service Provider (NWSP). The NWSP web application gives the web developer a fully functional set of SESM web components that demonstrate much of what can be done in an SESM web application. The NWSP sample web application can also be used as the basis for creating an SESM web application that meets the service provider's branding, look-and-feel, and functional requirements.

Two other sample web applications demonstrate how SESM might be used for service selection on specific devices:

The SESM software also includes three sample Captive Portal solution web applications:

For information on the sample SESM web applications, see "Sample SESM Web Applications."

Conventional Web Sites: A Problem

Most conventional web sites on the World Wide Web are structured in a manner that works well as long as certain assumptions about the user are met. For example, the user:

In the past, these assumptions were true for most users of conventional web sites.

The problem with conventional web sites is that they cannot adapt their content and format to the variety of user characteristics that are currently on the web. Today, web-based interfaces must accommodate more variety on the World Wide Web in the form of:

Sometimes it is required that the same information or services be provided to the same subscriber with a variety of applications, devices, and locales.

Customer circumstances such as the device, bandwidth, and language are outside of the control of the web site. Other customer characteristics are imposed by the web site itself. Is this a new or existing customer? With which brands is the web site associated? What level of service has the customer selected?

SESM Technology: A Solution

With SESM, the set of characteristics (for example, device, brand, and locale) that define a subscriber is called the user's shape. The web components, directory hierarchy, and infrastructure of a Cisco SESM web application are designed to provide an SESM web portal that is customized for each user's shape.

Because an SESM web application is designed to detect and adapt to each user's shape, the Cisco SESM web portal can provide customer-tailored content and service offerings as well as a high degree of brand identity. As an example, an SESM web application can identify the location of the subscriber and provide location-specific pages and service offerings.

How does the Cisco SESM dynamically adapt to the user's shape? There are a number of possible strategies for providing customized content:

Strategy 1

Strategy 1 can make web pages complex, error prone, and difficult to maintain. For example, the presentation of a web page targeted for a Personal Digital Assistant (PDA) is different from the presentation of the same page targeted for a PC. These size differences often require dynamic HTML scripting to accommodate the differences in page content and layout. Implementing and maintaining these pages can be difficult.

Strategy 2

Strategy 2 is often used when there is a requirement to support multiple languages. The entire web site is copied, and one language is replaced with another. For example, an English-language web site might be copied, and the English-language elements including text, currency symbols, formats of dates, and formats of numbers are replaced with Japanese-language elements. The end result is one web site for each language that is supported.

Strategy 2 ignores the commonality of elements on the multiple sets of web pages. As an example, the company logo might be the same on the pages in each web site but would need to be included in the set of resources in each web set. When you change the logo on one web site, the change has to be replicated on the other web sites. This approach is time-consuming and error prone.

If you need to support English, Japanese, and Spanish, and desktop PCs, color PDAs, and monochrome PDAs, both strategy 1 and strategy 2 become more complicated. Strategy 1 requires complex dynamic HTML techniques, and strategy 2 requires nine separate web sites.

Strategy 3

Strategy 3 is the approach to user customization that a Cisco SESM web application takes. This approach combines the most useful aspects of strategy 1 and strategy 2 while it attempts to minimize the drawbacks of both techniques. Cisco SESM software provides easy-to-use mechanisms for customizing web content and format based on each user's shape.

For detailed information on each of the preceding elements of the SESM web application, see "Basic SESM Customization and Development" and "Advanced SESM Customization."

Hardware and Software Requirements for Development

On the development machine, the following software must be installed and set up correctly:

http://java.sun.com/j2se/downloads.html

In addition to the preceding software, the other hardware and software requirements for SESM web development include the same requirements that apply to deploying an SESM web application except that no separate Java Runtime Environment (JRE) is needed because the Java 2 SDK is installed. For information on these other requirements and how to install and configure the SESM software, see the Cisco Subscriber Edge Services Manager Installation and Configuration Guide.

The development machine must have a J2EE-compliant web server installed and set up correctly. The Jetty web server is included with the SESM software. For information on installing and configuring a web server, refer to the instructions that apply to your web server.

Demo Mode and Development

You can install or configure the SESM software for demonstration mode to observe how the NWSP, PDA, or WAP web applications work. Demonstration mode is also useful during some phases of web-application development because this mode does not require other system components such as a configured Cisco edge router and SSG. For more information on demonstration mode, see the "Demo Mode" section.

Environment Variables

The installation instructions for the Java 2 SDK describe how to set the required environment variables. For information on where to find the installation instructions, see the README file that is installed with the Java 2 SDK. Before you start Cisco SESM web development, check that the environment variables shown in Table 1-1 are set to the indicated locations.


Table 1-1: Java 2 SDK Environment Variables
Environment Variable Value

JDK_HOME

The location of the Java 2 SDK Standard Edition installation if that SDK is used.

PATH

The location of the bin directory of the Java 2 SDK installation (for example, C:\jdk1.2.2\bin). This allows you to run the SDK executables from any directory.

Recommended Development Tools

The Cisco SESM software includes web components that were developed with Dreamweaver UltraDev, a visual editor for creating and managing web sites and pages, and Fireworks 4, a web graphics design and production facility. The current version of these products is Dreamweaver MX and Fireworks MX. We recommend these two state-of-the-art tools for SESM web development because with them you can create a customized SESM web application more quickly and easily.


Note   The Dreamweaver-related directions in this guide assume you are using the Dreamweaver 4 Workspace—a workspace layout preference you can choose in Dreamweaver MX.

Neither Dreamweaver MX nor Fireworks MX is required to develop an SESM web application. However, you can more easily modify some SESM web components using these tools. SESM web components that require Dreamweaver MX include the Dreamweaver templates for creating and modifying page layout and appearance.

Dreamweaver MX has a Live Data window feature that shows actual dynamic content that is generated by JSP pages. When you are developing a Cisco SESM web application, the Live Data window allows you to make changes to the JSP pages in a live-data environment.

Many SESM images and icons are also provided in Portable Networks Graphics (PNG) format so they can be easily customized in Fireworks. Image editors other than Fireworks may be limited in their ability to edit these PNG-formatted images and icons.

For information on Dreamweaver MX and Fireworks MX, see the Macromedia web site at:

http://www.macromedia.com

Both Dreamweaver MX and Fireworks MX are available at the web site for a free 30-day evaluation.

Learning about SESM Web Application Development

You should become familiar with the SESM components and techniques by reading this document and experimenting with a sample SESM application such as NWSP. Table 1-2 lists some topics with which the developer should be familiar.


Table 1-2: SESM Web Development Reading Path
For information on this topic Read this chapter or section

Overview of SESM components and techniques

"SESM Web Development Overview"

Customizing an SESM web application's look and feel

"Changing the Look-and-Feel Elements" section

Using the web components in a sample SESM web application

"Using a Sample SESM Web Application" section

Developing an SESM web application, including the steps needed to compile JSP pages

"Developing an SESM Web Application" section

Serving SESM web pages that match the user's shape

"User Shapes and User-Shape Decoration" section and "Decorating a User Shape" section

Using advanced customization techniques, such as modifying SESM web-application functionality

"Advanced SESM Customization"

Learning about the sample SESM web applications

"Sample SESM Web Applications"

Internationalizing and localizing an SESM web application

"SESM Internationalization and Localization"

Configuring and using the SESM tag libraries

"SESM Tag Libraries"

Configuring pre-decorators and post-decorators and learning about the SESM utility servlets

"SESM Utility Servlets Quick Reference"

Using the Cisco Navigation Bar extension

"Using the Cisco Navigation Bar Extension"

Helpful Web Sites and Other Resources

For information on J2EE, web application development, JSP pages, and other topics, the web provides many resources including the Java Developer Connection at http://developer.java.sun.com/developer. Table 1-3 lists some other recommended web-development resources.


Table 1-3: Web Development Resources
Resource Description

Core Servlets and JavaServer Pages (by Marty Hall, Sun Microsystems Press, 2000)

Excellent book for learning about JSP pages.

Java Servlet Specification Version 2.3 (Sun Microsystems, Inc., 2000)

Useful general information on web applications, deployment descriptor files, and other related topics. The PDF file containing the specification is at available at http://java.sun.com.

Java servlet or JSP class library documentation

Available as Javadoc in the /doc directory at the Java 2 SDK installation location.

HTML and Cascading Style Sheet specifications

Useful reference material is available at the World Wide Web Consortium (W3C) web site located at http://www.w3.org.

Web application archive (WAR) file information

Available in the Web Applications section of the Java Web Services Tutorial at http://java.sun.com/webservices/docs/1.0/tutorial/index.html

Beginning WAP, WML, and WMLScript (by Wei Meng Lee, Soo Mee Foo, et al, Wrox Press Ltd., 2000)

Very good resource for learning about WAP and WML.

If you plan to use Dreamweaver MX or Fireworks MX as development tools and are not familiar with their use, those facilities have their own documentation, Help systems, and web resources. For a list of documents available on the web, go to the Dreamweaver and Fireworks support centers at:

http://www.macromedia.com/support/dreamweaver/documentation.html

and

http://www.macromedia.com/support/fireworks/documentation.html




hometocprevnextglossaryfeedbacksearchhelp
Posted: Tue Dec 10 10:38:34 PST 2002
All contents are Copyright © 1992--2002 Cisco Systems, Inc. All rights reserved.
Important Notices and Privacy Statement.