构建多服务的 Java 应用程序,第 1 部分: 探索 WURFL

4 篇文章 0 订阅

学会在 JSP 中创建定制多服务标记的方法

developerWorks
前一页第 2 页,共 10 页后一页

文档选项
<script type="text/javascript"></script>
将打印机的版面设置成横向打印模式

打印本页


对本教程的评价

帮助我们改进这些内容


多服务简介

普适计算应用程序中的多服务

多服务是一种新兴概念。它使 Internet 应用程序能够为不同类型的请求客户机提供定制响应。

多服务在普适计算应用程序中的使用越来越普遍。当今,大量具有不同功能的无线设备都连接到 Internet。因此,对于很多 Internet 应用程序来说,为不同类型的无线设备服务定制的响应变得越来越重要。

假设您设计一个在线产品编目,而这个编目需要服务于各种功能不同的无线客户机。例如,一些客户机设备可能具有比较大的彩色显示器,而其他设备则可能具有比较小的黑白显示屏。一些客户机可能支持某种格式图像的显示,而其他客户机则可能支持另一种图像格式。

同样,有的客户机支持标记语言,而有的客户机则不支持标记语言。不同的无线设备和浏览器都支持以下三种流行的标记语言:

  1. WML
  2. XHTML
  3. Compact HTML(CHTML)

这些标记语言还具有各种版本并且有很多差别,这意味着您需要应对无数种可能,以提供一种最适合特定的请求客户机的标记语言。

出于演示的目的,本教程在 多服务的餐馆菜单 一节中讨论四种 WML 和 XHTML 标记。目前,您必须认识到:识别出试图访问编目应用程序的客户机是非常重要的。您的多服务编目应用程序识别客户机(换句话说,也就是它的制造商和型号),然后检查一些设备描述数据库以便了解请求客户机的功能。这使您的编目应用程序能够提供适合请求的客户机的响应。

万维网联盟(W3C)Mobile Web Initiative 理解了设备描述在普适应用程序中的重要性之后,发布了标题为 “Device Description Landscape” 的工作草案(请参阅 参考资料)。本草案讨论了描述设备功能以及相应地采用(或定制)响应的概念的几个方面。W3C 的工作草案中所提到的设备描述计划之一就是名为 WURFL 的开放源码项目。本系列教程主要关注使用 WURFL 作为多服务应用程序中的设备描述格式。





回页首


WURFL 简介

WURFL 是 SourceForge.net 上的一个开放源码项目。它定义设备描述的 XML 格式,并且包含有关名为 wurfl.xml 的 XML 文件中无线设备的一些重要信息,这个文件可以从 WURFL 的官方网站下载(请参阅 参考资料)。

wurfl.xml 文件包含以下设备描述信息:

  • 无线设备的制造商和型号
  • 每种类型的无线设备的 user-agent 字符串:通常情况下,客户机(如无线设备)会将 user-agent 字符串随请求一起发送到 Web 服务器。特定制造商和型号的所有设备都使用相同的 user-agent 字符串。因此,可以使用这个 user-agent 字符串确定请求客户机。当 Web 服务器接收到请求(如 HTTP 请求)时,它从请求中提取 user-agent 字符串,并检查 wurfl.xml 文件以识别请求客户机并了解它的功能。探索和处理 WURFL 一节介绍识别设备并从 wurfl.xml 中读取其设备描述的整个过程。
  • 无线设备的某些功能:wurfl.xml 文件定义了这些功能对于不同设备的值。设备功能连同其相对于某种设备的值便形成了特定设备的实际设备描述。WURFL 定义的最重要的设备功能包括:显示字符、安全性相关特性以及无线设备支持的标记类型、样式、字体和图片格式。

下一节介绍如何在多服务应用程序中使用 WURFL。





回页首


如何使用 WURFL

本教程介绍有关使用 WURFL 的三个方面:

  1. Java API:WURFL 包含综合的、功能全面的 Java API,可以使用它来处理 wurfl.xml。这个 API 只需知道来自请求客户机的 user-agent 字符串。它可以在内部解析 wurfl.xml,以了解发送 user-agent 字符串的设备的功能。本教程将介绍这个 API 的工作原理,并在 WURFL 的 Java API 一节中构建一个示例应用程序以说明它的使用方法。
  2. WALL:WURFL 随附的 JSP 标记库称为 WALL,用于构建多服务的 JSP 页面。WALL 标记内部使用 WURFL Java API 了解请求客户机设备的功能。探索 WALL 一节将详细介绍 WALL 以说明它如何使用 WURFL 的 Java API 进行多服务,帮助您了解如何构建定制的多服务标记。构建定制的多服务标记 一节演示在 WURFL 的基础上构建您自己的多服务标记。
  3. 导航:服务器端 Web 应用程序几乎总是具有支持导航的多个页面。这意味着 Web 应用程序需要收集用户的数据,并维护服务器端对象,这些对象打包用户的数据并在客户机导航应用程序时将该数据从一个页面发送到下一个页面。JSF 是一个标准的 Java 框架,它定义了一种机制,能够在客户屏幕上呈现用户界面组件(如数据提交表单)的机制、收集用户数据并在服务器端管理这些数据。为了在实际 Java 应用程序中充分利用 WURFL 功能,需要将多服务支持整合到 JSF 中。这需要将 WURFL 和 JSF 一起放到实际的、多页面以及多服务的 Web 应用程序中。本系列的第 2 部分介绍如何使用 WURFL 构建多服务 JSF 应用程序。




回页首


样本多服务应用程序简介

本教程通过构建一个餐馆的菜单应用程序来介绍多服务的概念,这个应用程序由两个 JSP 页面组成:multiServeMenuCategories.jsp 和 multiServeDishes.jsp。multiServeMenuCategories.jsp 页面提供特定于设备的标记,以显示餐馆菜单中包含的各种菜肴,如头盘或饭后甜点。multiServeDishes.jsp 页面提供特定于设备的标记,以显示特定菜单类别中包含的菜品。

WALL 已经提供了 multiServeMenuCategories.jsp 页面中所需的多服务标记,因此这个页面给您创造了详细研究 WALL 标记工作方式的机会。multiServeDishes.jsp 页面需要 WALL 中当前不可用的一些多服务支持,因此开发这个页面可以使您了解如何使用 WURFL 的 Java API 构建您自己的定制多服务 JSP 标记。

注意,在构建餐馆菜单应用程序的导航支持之前,本教程第一部分(即本教程)中开发的两个 JSP 页面不会彼此链接,而这个导航支持需要将 JSF 整合到餐馆菜单应用程序中。这方面的内容将在第 2 部分进行介绍。





回页首


多服务的餐馆菜单

WURFL 定义重要设备的功能,名为 preferred_markup,它指定设备首选的标记语言。多服务应用程序检查 wurfl.xml 文件以便读取 preferred_markup 功能的值。应用程序知道了特定请求客户机的首选标记之后,将以此作为依据向该客户机提供服务。

探索 WALL 一节介绍了 preferred_markup 功能的使用。因此,首先让我们讨论一下可用于在各种无线设备的屏幕上显示菜单的不同标记。

下几节介绍可以用来在餐馆菜单上显示可供应的菜肴分类的各种标记。





回页首


使用 WML 呈现餐馆菜单

浏览一下 图 1,其中显示了 WinWAP Smartphone Browser Emulator 的屏幕上显示的菜单分类。


图 1. WinWAP Smartphone Browser Emulator 屏幕上显示的菜单分类
图 1. WinWAP Smartphone Browser 屏幕上显示的菜单分类。

清单 1 显示了 WALL 所生成的 WML 标记,它显示 图 1 中所示的菜单分类。


清单 1. 用于在 WinWAP Smartphone Browser Emulator 上显示菜单分类的 WML 标记
                    
<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" 
"http://www.wapforum.org/DTD/wml_1.1.xml">
<wml>
    <head>
       <meta name="taglib" content="WALL" />
    </head>
    <card id="w" title="Restaurant Menu">
        <p>
           <a href="http://www.AFictitiousRestaurant.com/starter" 
              title="Starters">
              Starters
           </a><br/>
           <a href="http://www.AFictitiousRestaurant.com/main" 
              title="Main Course">
              Main Course
           </a><br/>
           <a href="http://www.AFictitiousRestaurant.com/desserts" 
              title="Desserts">
              Desserts
           </a><br/>
        </p>
    </card>
</wml>

注意,清单 1 中的 WML 标记使用一个 <p> 标记包装了大量 <a> 标记,其中每个 <a> 标记代表一个菜单分类。<a> 标记的作用是使每个分类成为一个超链接,以使 WinWAP Smartphone Browser Emulator 的用户可以激活这个链接,查看菜单分类中所包含的菜肴。

图 2 显示了 Openwave 的 Phone Simulator Version 5.1,其中显示了 图 1 所示的相同菜单分类。


图 2. Openwave 的 Phone Simulator 5.1 上显示的菜单分类
图 2. Openwave 的 Phone Simulator 5.1 上显示的菜单分类

清单 2 显示了在 Phone Simulator 5.1 上显示菜单分类所需的 WML 代码。


清单 2. 在 Phone Simulator 5.1 屏幕上显示菜单分类的 WML 标记
                    
<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//PHONE.COM//DTD WML 1.1//EN" 
"http://www.phone.com/dtd/wml11.dtd" >

<wml>
    <head>
       <meta name="taglib" content="WALL" />
    </head>

    <card id="w" title="Restaurant Menu">
       <p align="left" mode="nowrap">
          <select>
              <option onpick="http://www.AFictitiousRestaurant.com/starter" 
                  title="Starters">
                  Starters
              </option>
              <option onpick="http://www.AFictitiousRestaurant.com/main" 
                  title="Main Course">
                  Main Course
              </option>
              <option onpick="http://www.AFictitiousRestaurant.com/desserts" 
                  title="Desserts">
                  Desserts
              </option>
          </select>
       </p>
    </card>
</wml>

将清单 12 对比之后,将会发现 清单 2 中的 WML 代码使用 <select> 标记来包含大量的 <option> 标记。这意味着 图 2 实际上是在使用 <select> 以及 <option> 子标记的基础之上显示了 WML 菜单。建议使用 <select> 标记在 Phone Simulator 5.1 屏幕上显示菜单项。这也就是 WALL 为使用 Phone Simulator 5.1 的客户机生成 <select> 标记的原因。





回页首


使用 XHTML

现在,让我们观察一下 Openwave 的 Phone Simulator Version 7.0,它是设备模拟器的一个示例,其首选标记是 XHTML。假设您想在 Phone Simulator 7.0 模拟器屏幕上提供餐馆菜单,如 图 3 所示。


图 3. Phone Simulator 7.0 屏幕上显示的餐馆菜单
图 3. Phone Simulator 7.0 屏幕上显示的餐馆菜单

清单 3 显示了在 Phone Simulator 7.0 屏幕上显示餐馆菜单所使用的 XHTML 标记。


清单 3. 在 Phone Simulator 7.0 屏幕上显示菜单分类的 XHTML 标记
                    
<?xml version="1.0"?> 
<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" 
"http://www.wapforum.org/DTD/xhtml-mobile10.dtd"> 
 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> 
    <head> 
       <title>Restaurant Menu</title> 
    </head> 
 
    <body> 
       <ol> 
           <li>
               <a accesskey="1" 
                  href="http://www.AFictitiousRestaurant.com/starter" 
                  title="Starters">
                  Starters
               </a>
           </li> 
           <li>
               <a accesskey="2" 
                  href="http://www.AFictitiousRestaurant.com/main" 
                  title="Main Course">
                  Main Course
               </a>
           </li> 
           <li>
               <a accesskey="3" 
                  href="http://www.AFictitiousRestaurant.com/desserts" 
                  title="Desserts">
                  Desserts
               </a>
           </li> 
       </ol> 
    </body> 
</html>

可以看到 清单 3 中的 XHTML 标记使用 <ol> 标记,以有序列表的形式包含餐馆菜单中的各个分类。图 4 显示以一种更让人着迷的方式来提供菜单分类,使用两种颜色区分不同的菜单分类视图。


图 4. 以一种更让人感兴趣的方式提供菜单种类
图 4. 以一种更有趣的方式提供菜单分类

清单 4 显示生成 图 4 中屏幕截图的 XHTML 标记。注意 清单 4 使用 <table> XHTML 标记包含不同的分类。每个分类都成为一个表的单元格。


清单 4. 使用颜色和表支持显示菜单分类的 XHTML 标记
                    
<?xml version="1.0"?> 
<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" 
"http://www.wapforum.org/DTD/xhtml-mobile10.dtd"> 
 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> 
    <head> 
      <title>Restaurant Menu</title> 
      <style> 
          .bgcolor1 { background-color:#99CCFF;} 
          .bgcolor2 { background-color:#FFFFFF;} 
      </style> 
    </head> 
 
    <body> 
        <table> 
           <tr> 
              <td class="bgcolor1"> 1 
                 <a accesskey="1" 
                    href="http://www.AFictitiousRestaurant.com/starter" 
                    title="Starters">
                    Starters
                 </a>
              </td> 
           </tr> 
           <tr> 
              <td class="bgcolor2"> 2 
                 <a accesskey="2" 
                    href="http://www.AFictitiousRestaurant.com/main" 
                    title="Main Course">
                    Main Course
                 </a>
              </td> 
           </tr> 
           <tr> 
              <td class="bgcolor1"> 3 
                 <a accesskey="3" 
                    href="http://www.AFictitiousRestaurant.com/desserts" 
                    title="Desserts">
                    Desserts
                 </a>
              </td> 
           </tr> 
        </table> 
    </body> 
</html>

另外请注意,清单 4 包括 <style> 标记,该标记定义两种背景颜色。每个 <td> 标记(位于 清单 4 中)都具有一个引用背景颜色的类属性。该类属性的值在相邻的 <td> 标记中是不同的,而在 <td> 标记中是相同的。以这种方法使用类属性,就为每个分类呈现出了不同的背景颜色。

并不是所有的 XHTML 设备都支持在表中显示时使用颜色。因此,WALL 需要检查请求客户机支持哪些 XHTML 功能。如果它支持使用具有彩色单元的表格,则提供 清单 4 中的 XHTML 标记;否则提供 清单 3





回页首


借助 WALL 生成菜单种类

上面您已经看到了为显示菜单分类,不同的设备需要生成的四种不同的标记示例。WALL 提供多服务标记,可以用于:

  • 自动检测请求客户机设备的功能
  • 提供最适合请求客户机的标记

清单 5 显示一个名为 multiServeMenuCategories.jsp 的 JSP 页面,该页面使用 WALL 的多服务标记生成各种特定于设备的标记(前面在清单 1234 中给出的标记)。


清单 5. multiServeMenuCategories.jsp
                    
<%@ taglib uri="/WEB-INF/tld/wall.tld" prefix="wall" %>
<wall:document>
   <wall:xmlpidtd />

   <wall:head>
       <wall:title>Restaurant Menu</wall:title>
       <wall:menu_css />
   </wall:head>

   <wall:body>
       <wall:menu colorize="true" autonumber="true">
           <wall:a href="http://www.AFictitiousRestaurant.com/starter" 
              title="Starters">
              Starters
           </wall:a>
           <wall:a href="http://www.AFictitiousRestaurant.com/main" 
              title="Main Course">
              Main Course
           </wall:a>
           <wall:a href="http://www.AFictitiousRestaurant.com/desserts" 
              title="Desserts">
              Desserts
           </wall:a>
       </wall:menu>
   </wall:body>
</wall:document>

清单 5 中可以看到,需要使用各种 WALL 标记以便多服务于菜单分类:

  • <wall:document>:该标记只包含一个 WALL 文档。<wall:xmlpidtd> 标记(位于 <wall:document> 标记中)根据请求客户机的首选标记创建 XML 头部(header)。
  • <wall:menu_css>:该标记位于 <wall:head> 标记内,提供相关样式的标记,如 清单 4 中所示。如果设备不支持使用这些样式,则 <wall:menu_css> 不会生成这种样式的标记。
  • <wall:menu>:该标记位于 <wall:body> 标记内,包含大量 <wall:a> 标记。每个 <wall:a> 标记都多服务于一个菜单分类(例如,头盘或饭后甜点)。

下几节介绍这些 WALL 标记如何在内部使用 WURFL 功能多服务于不同类型的标记。最后一节介绍如何构建您自己的多服务标记以及如何在 multiServeDishes.jsp 页面中使用这些标记以呈现特定于设备的标记。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值