Transcript Java in XML - Alex Chaffee's Purple Technology

Building Wireless Applications
Using Java and XML
Alex Chaffee, [email protected]
http://www.purpletech.com
©1996-2001 Alex Chaffee
WAP Architecture
Cell phone /
PDA
WAP
WAP
Gateway
HTTP
HTTP
Server
Which Gateway?
• Europe: whichever
– Cell phone contains modem, signal carries PPP connection
to any cell ISP
• U.S.: hardcoded to carrier
– Same technology (?)
– IP address of ISP hardcoded by vendor
• Security
– If I make a secure connection to my bank, maybe I don't trust
my carrier's gateway not to snoop
• Choice
– Inhibits competition among wireless ISPs
• Privacy
– My carrier can monitor my behavior (traffic, email)
Wireless Client Types
• Physical Devices
–
–
–
–
PC, Cellphone, Palmtop, Minilaptop
HTML, WML, HDML, iMode, etc.
J2ME-compliant or not
many versions
• WAP Gateways
– proxy to WML browsers
• Or to HDML etc. browsers
– many versions
On J2ME
• Client-side Java
– Flexible
– Powerful
– Not yet ubiquitous
• Server-side Java
– Direct access to data
– Click and wait
– WML/WAP much more widespread at present
• Very analogous to applet vs. servlet
• This talk: all about server-side
Developing Wireless Applications
• Get a web server
– Apache
– Tomcat
– Add WML mime-type
• text/vnd.wap.wml
• Get an emulator/SDK
– Phone.com
– Ericsson.com
– Nokia.com
• Learn WML
– Phone.com SDK has good docs/specs
WML
• XML-compliant language
• Similar to HTML
– Defines display, input, links for small devices
• Central concept is not page but card and deck
– Allows many cards (pages) to be downloaded
simultaneously
• WMLScript
– Allows more client-side interactivity, like JavaScript
– Not widely supported (phone.com browsers only)
WML Example
<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"
"http://www.wapforum.org/DTD/wml_1.1.xml">
<wml>
<card>
<p>
Hello Wireless World!
</p>
</card>
</wml>
» Thanks, Chad 
WML Example 2
<wml>
<card>
<p>
Computing Central <br/>
<a href="#java_card" title="Java tips, tricks">Java
News</a>
<a href="#cpp_card" title="C++ news, jobs">C++ News</a>
</p>
</card>
<card id="java_card">
<p>
Welcome to the world of Java, the daily tip is ...
</p>
</card>
<card id="cpp_card">
<p>
Hot jobs in the C++ community...
</p>
</card>
</wml>
Wireless application = Web
application
• Since WAP gateways call regular HTTP
servers
• Developing wireless apps is identical to
developing web apps
– Except for a few small details 
Server-Side Java-XML Architecture
Java UI
Java
Business
Logic
JSP
WAP/HTTP
Request
Servlet
HTML/
WML
XML
Processors
XML Data
Sources
JavaBeans
DOM, SAX,
JDOM
Filesystem
EJB
XPath
XML-savvy
RDBMS
XSL
XML
Data Feed
Server-Side Architecture Notes
• Note that you can skip any layer, and/or call
within layers
– e.g. XML->XSL->DOM->JSP, or
– JSP->Servlet->DOM->XML
Cache as Cache Can
•
•
•
•
•
Caching is essential
Whatever its advantages, XML is slow
Cache results on disk and/or in memory
See www.purpletech.com for a cache class
Also org.jdom.contrib.beans.JDOMBean
Data Sources
•
•
•
•
•
XML files
Databases
XML database wrappers
Binary data feeds
XML data feeds
Data Flow
• request-driven
• data-driven
Request-driven flow
Data Layer
Java Layer
WAP/HTTP
Request
XML
Processor
XML Data
Source
Java Logic
Database
or
Filesystem
HTML/
WML
Java UI
Request-Driven Flow (ContextDriven)
• client makes WAP request
• gateway makes HTTP request
• JSP examines context
– request/device/variables/time of day/...
• JSP/Servlet acquires correct XML
• JSP parses XML, extracts data
• JSP outputs WML
Data-driven flow
WAP/HTTP
Request
?
XSL
Stylesheet
XML Data
Source
XSLT
Processor
HTML/
WML
XML
Wrapper
Database
or
Filesystem
Data-Driven Flow
• XML data source
• XSL transformation into WML or HTML
• How to choose…
– Which XSL stylesheet to use?
– Where to get the data?
– How to invoke the XML wrapper?
Mixed Flow
• client makes request
• servlet/jsp
–
–
–
–
–
–
–
identifies client browser
examines request
acquires XML data
acquires XSL file
invokes XSL processor
Postprocesses XML
outputs WML/HTML/HDML/...
XMLC
• Separates presentation template from
presentation formatting code
• See xmlc.enhydra.org
HTML
(with ID tags)
Reading
data
XMLC
HTML Object
(automatically
generated)
Setting
values Java Class
(e.g. Servlet)
HTML (dynamically-generated)
Data
XMLC + WML + HTML
WML Source:
<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"
"http://www.wapforum.org/DTD/wml_1.1.xml">
<wml>
<card>
<p>Date: <SPAN id="date">some date</SPAN></p>
<p id="motd">some message</p>
</card>
</wml>
HTML Source:
<HTML>
<TITLE><HEAD>Message of the Day</HEAD></TITLE>
<BODY><B>Date:</B> <SPAN id="date">some date</SPAN></p>
<p id="motd">some message</p>
</BODY>
</HTML>
Java source:
obj.setElementDate( new Date().toString() );
obj.setElementMotd( "You are in a maze of twisty little passages" );
out.print(obj.toDocument());
Wireless Development Problems
(with solutions)
•
•
•
•
•
•
Missing HTTP features
Response size
Identifying the Client Browser
Images
Languages/Locales
Which output format (wml/html/…)?
– WML Incompatibilities
• Screen Scraping
Missing HTTP features
• Not supported by all gateways/browsers
• Redirects
– most do
– some don't
• Cookies
– most gateways don't support cookies
– must use URL Rewriting
• Some servlet engines are bad at this
– Anecdotally
• 25-50% of requests don't support cookies
• same model, same provider, one phone works, one doesn't
Response Size
• There is a hard limit on size of response
• Dependent on gateway and browser/device
• About 1.5 K
– After response is compressed and encoded by WAP
gateway
• Therefore, it's impossible to know if you've reached
the limit, unless you fail
– "cache 22"
• Solution: stay below 2K uncompressed and you
should be fine
Identifying the Client Browser
•
•
•
•
Hard problem, unfortunately
User-Agent header not always sufficient
Accept header not always accurate
(But those are the only headers you can
use)
• Also, device  browser, and sometimes they
provide different functions
One Solution:
• Allow user to set browser preference on
login
• Chicken-and-egg problem
– Which browser do you pick first?
– Make best guess: usually not unintelligible
Better Solution: Capabilities
• Apply rules to identify browser based on
headers
• Mapping from browser to capabilities
• Make decisions based on capabilities, not
browser
– Allows migration, forward compatibility with new
browsers, and making use of previously unknown
features
– Not tied down to what you know (or what you think
you know) about a specific browser
More About Capabilites
• Note: be fuzzy in matching, to catch future
versions of same device (hopefully)
• Note: Store device in session, so you don't
have to keep determining it
• Yes, there are a lot of devices to keep track
of
– Morphis has a list, keeping it updated
Example:
<device id="sam-sch6100">
<name>Samsung SCH-6100</name>
<imgext>bmp</imgext>
<capabilities>
<capability name="languages" value="English, Spanish"/>
<capability name="allow_images" value="1"/>
<capability name="resolution_height" value="32"/>
<capability name="resolution_width" value="96"/>
<capability name="max_num_lines" value="4"/>
<capability name="UP_designation" value="SC03"/>
<capability name="locations" value="US"/>
<capability name="network" value="CDMA"/>
</capabilities>
<rules>
<headerrule name="User-Agent" type="regexp">UP\.Browser/3.*SC03 .*
</headerrule>
</rules>
<xsl name="wmltransform.xsl" mime="text/vnd.wap.wml"/>
</device>
Other Capabilities Initiatives
• CC/PP
– W3C
• UAProf
– WAP Forum
• Not widely supported (yet?)
• Also related to Personalization
Open-Source
Content Management Frameworks
•
•
•
•
Lutris Enhydra
Kargo Morphis
Cocoon
IBM
One URL Fits All
• Want to be able to
– Email a URL to someone with a different device
– Synchronize wireless/wired bookmarks
• Good:
– http://www.foo.com/thing.jsp
• Bad:
– http://www.foo.com/cellphone/nokia/9100/thing.jsp
• (TM Bluestone) "Total-E-Mobile"
Images
• Different browsers: different…
• Screen size (resolution)
– 28x20, 65x25, 91x50, 96x24, 96x32, 96x44,
96x64, 101x80, 128x64, 134x60, 160x160,
160x200, 240x160, 240x320, 310x100, 480x160,
640x240, 640x480, 800x600, ...
• Image types accepted
– GIF, JPEG, BMP, WBMP
• Color depth
– B/W, grayscale, 8-bit color, ...
Images: Solution
• Create several base images
– different sizes/colors/formats
– e.g. logo.32x32.bw.wbmp, logo.96x96.col.gif
• Write matching/transforming algorithm
– look for closest fit
– transform (scale/dither/reformat) as necessary
• What if an image cannot be legibly shrunk
smaller than a certain size?
– May be necessary to split image across several
cards
One More Thing About Images
• Some browsers have trouble loading more
than one image per page
• D'oh!
Morphis Images
• <wax:img srcid="foo"/>
• Matches
–
–
–
–
foo.gif
foo_Gnok-7110.gif
foo_Gwml.gif
foo_Len.gif
Languages/Locales/Encoding
• Accept-Language header should be canonical
• Once you determine language, store it in the
session and/or a cookie
• Should also allow override with a a "lang"
parameter or persistent user preference
• Language may need to be ID'd before loading data
• WML supports xml:lang attribute
– Usage is ambiguous
– Results in large response pages (containing all languages)
Java Localization Tricks
• Store strings etc. in ResourceBundle object
– Substitute in correct version at runtime
• XMLC
– Elements tagged with id attribute
– Runtime substitution of element content
Character encoding
• Default: UTF8
• By device - some are only able to support
certain encodings
– iMode requires Shift-JIS
• Should store as browser capability
WML Incompatibilities
• Really irritating
• Different implementations/interpretations of
WML spec
• Need to tailor output to browser (not just
capability)
• Example: wml:select
– Selectable bullet-list
– UP browsers: looks nice
– Nokia browser: looks ugly
One solution to WML
Incompatibilities
•
•
•
•
Intermediate markup language
Write your apps in this language
Provide transformations
Intermediate language
– <fooml:choice>…
• Transform source
– phone.com (up) -> <wml:select>
– nokia -> list of <wml:a> (link)
• E.g. WAX (part of Morphis)
Screen Scraping
• Some systems accept HTML and strip/parse
– Avant Go, etc.
• If you depend on these, don't need to learn
WML
• Still need to deal with browser issues
– Not a panacea
• When it works, it works great
– But most of the time it doesn't work 
Morphis Overview
•
•
•
•
•
Dispatching
Translating (based on XSLT / Xalan)
Caching
WAX (an abstract markup language)
device.x ml (catalog of wireless devices)
Conclusion
• Wireless apps have growing pains
• Some problems with the WWW were
solved, many were not, plus many new ones
• Be patient:
– devices are getting better all the time
– HTML is becoming XML
• My prediction: within a few years the
platforms will converge, and WML will be
supplanted by HTML
For More Information
• www.purpletech.com
• www.morphis.org
• xmlc.enhydra.org