JSP和JSF合并 共同打造完美的Web应用

转载 2007年09月28日 12:58:00

Java在最近几年逐渐升温,随着Java SE 5和Java SE 6的推出,Java的未来更显得无比辉煌。但以Java为基础的JSP在 Java SE 5推出之前却一直抬不起头来,这最重要的原因就是JSP虽然功能十分强大,但最大的优点也是它的最大缺点,功能强大就意味着复杂,尤其是 设计前端界面的可视化工具不多,也不够强大。因此,设计JSP页面就变得十分复杂和繁琐... 

  Java在最近几年逐渐升温,随着 Java SE 5和Java SE 6的推出,Java的未来更显得无比辉煌。但以Java为基础的JSP在Java SE 5推出之前却一直抬不起头 来,这最重要的原因就是JSP虽然功能十分强大,但最大的优点也是它的最大缺点,功能强大就意味着复杂,尤其是设计前端界面的可视化工具不多,也不够强 大。因此,设计JSP页面就变得十分复杂和繁琐。不过,在Java SE 5推出的同时,Sun为了简化JSP的开发难度,推出了新的 JavaServer Faces(简称JSF)规范。从而使JSP走上了康庄大道。



  一、什么是JSF 
  JSF和JSP是一对新的搭档。JSP是用于后台的逻辑处理的技术,而JSF恰恰相反,是使开发人员能够快速的开发基于 Java 的 Web 应用程序的技术,是一种表现层技术。目前,JSF1.2已经正式作为一个标准加入了Java EE 5中。 

   作为一种高度组件化的技术,开发人员可以在一些开发工具的支持下,实现拖拉式编辑操作,用户只需要简单的将 JSF 组件拖到页面上,就可以很容易的进 行 Web 开发了。这是其作为一种组件化的技术所具有的最大好处,我们能用的组件不光是一些比较简单的输入框之类,还有更多复杂的组件可以使用的,比如  DataTable 这样的表格组件, Tree 这样的树形组件等等。 

  作为一种标准的技术,JSF还得到了相当多工具提供商的 支持。同时我们也会有很多很好的免费开发工具可以使用,前不久 Sun Java Studio Creator 2 和  Oracle JDeveloper 10g 作为免费的支持 JSF 的开发工具发布,给 JSF 带来了不小的生气。另外我们也有一些很优秀的商业 开发工具可共选择,BEA Workshop (原 M7 NitroX),Exadel,MyEclipse 这样的基于 Eclipse 的插件开发 工具,为现在广大的 Eclipse 用户带来了不小的便利,IBM 的 Rational Application Developer 和  Borland 的 JBuilder 也是很不错的支持 JSF 可视化开发的商业开发工具。 

  JSF和传统的Web技术有着本 质上的差别,在传统的Web技术需要用户自己对浏览器请求进行捕捉,保存客户端状态,并且手工控制着页面的转向,等等。而JSF的出现,无疑给我们带来了 巨大的便利,JSF 提供了事件驱动的页面导航模型,该模型使应用程序开发人员能够设计应用程序的页面流。与 Struts 的方式向类似的是,所有的页 面流信息都定义在 JSF 配置 XML 文件 (faces-config.xml) 中,而非硬编码在应用程序中。这很大程度简化了开发人员开发难 度,简化了应用程序的开发。 

  同时JSF也是一种遵循模型-视图-控制器 (MVC) 模式的框架。实现了视图代码(View)与应 用逻辑(Model)的完全分离,使得使用 JSF 技术的应用程序能够很好的实现页面与代码的分离。所有对 JSF 页面的请求都会通过一个前端控制器  (FacesServlet) 处理,系统自动处理用户的请求,并将结果返回给用户。这和传统的 MVC 框架并没有太大的区别。 

   在JSF中不仅使用了 POJO 技术,而且还使用了类似 Spring 的控制反转(IoC) (或称为依赖注入-DI) 技术,在 JSF 的  Backing Bean 中,我们可以把视图所需要的数据和操作放进一个 Backing Bean 中。同时得益于 JSF 使用的 DI 技术, 我们可以在配置文件中初始化 Managed Bean,同时我们也可以通过这样的技术很方便的和使用类似技术的 Spring 进行整合。

  二、如何在JSP中使用JSF 

   JSF只有通过和JSP相结合,才能充分发挥它的功效。JSF是通过标签库和JSP进行集成的。标签库就相当于ASP.NET的服务端组件。JSF提供 了非常丰富的标签库,通过这些标签库,可以生成各种客户端模型,如HTML、WML、XML以及JavaScript等。通过这些标签,你可以很容易建立 大规模的客户端模型,并由这些标签自动处理客户端请求。 

  接下来让我们来看一个如何使JSF和JSP在一起工作的例子。在JSF中有 两个库。第一个叫做内核库,在这个库中包含了各种主要的标签,如配置组件、管理事件、验证输入信息等。第二个库的主要功能是将HTML和JSF的各种标签 相对应。每一个JSF标签都会对应一个HTML组件。如UIInput标签对应了HTML中的文本框或密码框。 

  在JSF标签中文本输入框叫做inputText,而密码输入库叫inputSecret。下面是一个简单的JSF和JSP结合的用户接口程序。 

  <%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %> 

  <%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %> 

  <html> 

  <head> 

  <meta HTTP-EQUIV="Content-Type" CONTENT="text/html;CHARSET=GB2312"> 

  <title>第一个JSF程序</title> 

  </head> 

  <body> 

   <f:view> 

   <h:form id="simpleForm"> 

   <h:outputText id="favoriteLabel" value="请输入一个数字:"/> 

   <h:inputText id="favoriteValue" value="#{simple.longValue}"> 

    <f:validateLongrange maximum="30" minimum="0"/> 

   </h:inputText> 

   <p/> 

   <h:commandButton id="submit" value="提交" action="#{simple.simpleActionMethod}"/> 

   </h:form> 

   </f:view> 

  </body> 

  </html> 

   在上面的代码中,我们可以了解到JSF是如何同JSP集成的。我们首先可以看到一个内核标签:view。然后是几个JSF组件。如form、 outputText、inputText以及commandButton。这几个组件被放到form中从而开成了form中的一部分。在程序的最开始, 必须使用import导入两个标签库。代码如下。 

  <%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %> 

  <%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %> 

   上面2行代码声明了JSP中要使用哪一个JSF标签库。内核库使用前缀(prefix)f声明,而HTML库使用前缀(prefix)h声明。这两个前 缀并不是必须要使用,而只是一个建议。在程序中,内核库必须要使用,因为view在所有的JSF页中必须使用。而HTML标签在运行时将JSF标签转化为 HTML组件,这个h前缀并不是必须的,而是JSF规范推荐使用的,这样,我们使我们的JSF程序更易读。 

  在声明后是几行标准的HTML语句,本文不再详述。从<f:view>开始,是一段JSF语句。这段代码如下所示: 

  <f:view> 

  <h:form id="simpleForm"> 

  <h:outputText id="favoriteLabel" value="请输入一个数字:"/> 

  <h:inputText id="favoriteValue" value="#{simple.longValue}"> 

  <f:validateLongrange maximum="30" minimum="0"/> 

  </h:inputText> 

  <p/> 

  <h:commandButton id="submit" value="提交" 

  action="#{simple.simpleActionMethod}"/> 

  </h:form> 

  </f:view> 

   </f:view>标签预示着JSF的开始,而它的下一个标签form将建立一个HTML Form。而outputText标签相当于HTML中的 label组件。inputText标签相当于HTML中的textField组件。而commandButton标签相当于HTML中的submit按 钮。运行这个JSP程序,将得到如图1所显示效果。   


  三、JSP如何响应JSF的请求 

  从上面的例子我们已经知道如何在JSP中使用JSF了,在这一部分让我们来看看在JSF是如何处理请求的。 

  首先让我们来看一个例子,这个例子是将华氏度转换为摄氏度。当用户点击提交按钮时程序将进行转换。 

  <%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %> 

  <%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %> 

  <html> 

  <head> 

   <meta HTTP-EQUIV="Content-Type" CONTENT="text/html;CHARSET=GB2312"> 

  <title>温度转换程序</title> 

  </head> 

  <body> 

   <f:view> 

   <h:form> 

   <div> 

    <h:outputText id="fahrenheitLabel" value="请输入华氏温度:"/> 

    <span> 

     <h:inputText id="temperature" value="#{tc.fahrenheitTemp}"> 

     <f:validateDoublerange minimum="-100.0" maximum="100.0"/> 

     <f:valuechangeListener type="tempconv.page.TCChangedListener"/> 

    </h:inputText> 

    </span> 

   </div> 

   <div> 

    <h:outputText id="celsiusLabel" value="摄氏温度:"/> 

    <span> 

     <h:outputText id="celsiusValue" value="#{tc.celsiusTemp}"> 

     <f:convertNumber maxFractionDigits="3" type="number"/> 

    </h:outputText> 

    </span> 

   </div> 

   <div> 

    <h:commandButton value="转换" action="#{tc.convert}"> 

    </h:commandButton> 

   </div> 

   </h:form> 

   </f:view> 

  </body> 

  </html> 

  在程序的前两行是导入JSF核心库和HTML库,这个在前面已经讨论过,在这里不再详述。 

   下面让我们来看看JSF标签是如何同后端进行交互的。由于我们是在JSP中使用JSF,因此,这个和正常的JSP没有什么区别;JSP实际上就是 Servlet,在JSP第一次运行时由JSP编译器将.JSP文件编译成Servlet后再由Servlet调用,然后由Servlet来接收客户端传 过来的数据流。但和一般的JSP程序不同的是,JSF标签是由JSF API负责调用的(这样可以做到逻辑层和表现层分离),除此之外,它们和一般的 JSP标签没有任何区别。 

  当UIComponent标签收到doStartTag方法时,JSF将使用这些属性来设置标签的值。如本例中的inputText标签将按它的属性值来设置。下面是JSF的代码片段。 

  <h:inputText id="temperature" value="#{tc.fahrenheitTemp}"> 

   <f:validateDoublerange minimum="-100.0" maximum="100.0"/> 

   <f:valuechangeListener type="tempconv.page.TCChangedListener"/> 

  </h:inputText> 

   inputText标签根据相应的值设置了id和value的属性。在JSF中是通过setAttribute(String name,  Object value)设置每一个属性值的。但我们需要注意的是JSF标签可以指定相应的默认值。这有些类似java中的系统属性,如果你给了一个 属性名子,那系统将返回这个属性的值,如果指定它的默认值,并且这个属性不存在的话,将返回这个默认值。 

  接下来让我们来看看上面程序的最重要的部分,也就是UIInput组件的事件处理。 

  <f:valuechangeListener type="tempconv.page.TCChangedListener"/> 

   在JSF中事件处理是由valuechangeListener标签完成的。这个标签所表示的事件在文本框的值发生变化时引发事件。但有意思的是这个事 件并不马上提交,而是要等到用户点击"提交"按钮后这个事件连同相应的数据才提交给后端。因此,这个事件请求也叫做预提交。最后,让我们看看 UICommand的代码实现。 

  <div> 

   <h:commandButton value="转换" action="#{tc.convert}"> 

   </h:commandButton> 

  </div> 

   上面的代码将convert()方法和UICommand连接了起来,也就是说,点击"提交"按钮后,将执行convert()方法。在遇到view标 签后,JSF程序结果,JSFAPI最后调用doEnd方法来结束JSF程序。JSF引擎在解析这段程序后,将相应的JSF标签转换为HTML组件。 

  最后,让我们来看看JSP是如何响应JSF事件的。下面是一段响应JSF事件的Java代码。 

  public class TCChangedListener implements ValueChangeListener 

  { 

   public TCChangedListener() 

   { 

    super(); 

   } 

   // 事件处理 

   public void processValueChange(ValueChangeEvent event) 

  throws AbortProcessingException 

   { 

    UIComponent comp = event.getComponent(); 

    Object value = event.getNewValue(); 

    if (null != value) 

    { 

     float curVal = ((Number) value).floatValue(); 

     Map values = comp.getAttributes(); 

     if (curVal < 0) 

     { 

      values.put("styleClass", "red"); 

     } 

     else 

     { 

      values.put("styleClass", "black"); 

     } 

    } 

  } 

  要想响应JSF事件,必须要实现JSF库中的ValueChangeListener接口。上面的程序要注意的是最后根据输入的值来设置相应的颜色。这些值并不依赖JSP。当然,你也可以将它们设置成null,而由JSP 标签来设置它们的颜色.

<script type="text/javascript"><!-- google_ad_client = "pub-8908527459010687"; google_ad_width = 728; google_ad_height = 15; google_ad_format = "728x15_0ads_al_s"; google_ad_channel = ""; google_color_border = "FFFFFF"; google_color_bg = "FFFFFF"; google_color_link = "004299"; google_color_text = "000000"; google_color_url = "008000"; //--> </script> <script src="http://pagead2.googlesyndication.com/pagead/show_ads.js" type="text/javascript"> </script> <iframe name="google_ads_frame" marginwidth="0" marginheight="0" src="http://pagead2.googlesyndication.com/pagead/ads?client=ca-pub-8908527459010687&amp;dt=1191009433250&amp;lmt=1189778532&amp;prev_fmts=728x90_as&amp;format=728x15_0ads_al_s&amp;output=html&amp;correlator=1191009433171&amp;url=http%3A%2F%2Fwww.wujianrong.com%2Farchives%2F2007%2F03%2Fjspjsf_web.html&amp;color_bg=FFFFFF&amp;color_text=000000&amp;color_link=004299&amp;color_url=008000&amp;color_border=FFFFFF&amp;ref=http%3A%2F%2Fwww.google.cn%2Fsearch%3Fcomplete%3D1%26hl%3Dzh-CN%26q%3D%253C%2525%40%2Btaglib%2Buri%253D%2522http%253A%252F%252Fjava.sun.com%252Fjsf%252Fhtml%2522%2Bprefix%253D%2522h%2522%2B%2525%253E%26btnG%3DGoogle%2B%25E6%2590%259C%25E7%25B4%25A2%26meta%3D%26aq%3Dnull&amp;cc=100&amp;ga_vid=335171839.1191009433&amp;ga_sid=1191009433&amp;ga_hid=802132063&amp;flash=9&amp;u_h=768&amp;u_w=1024&amp;u_ah=738&amp;u_aw=1024&amp;u_cd=32&amp;u_tz=-420&amp;u_java=true" frameborder="0" width="728" scrolling="no" height="15" allowtransparency="allowtransparency"></iframe>
相关文档(Relevant Entries)
Posted on March 3, 2007 12:15 AM | | | Comments (0) | | TrackBacks (0)

引用地址(TRACKBACKS)
 
TrackBack URL for this entry:
http://www.wujianrong.com/mt-tb.cgi/4683

发布评论(ADD YOUR COMMENTS)
 
感谢您参与评论;发表您的意见时请保持文章的相关性;不相关的或是单纯宣传的内容可能会被删掉。您的E-mail只是用来确认您发表的文章,不会出现在网页上。
Please keep your comments relevant to this blog entry. Email addresses are never displayed, but they are required to confirm your comments.
 

JSP和JSF合并 共同打造完美的Web应用

  Java在最近几年逐渐升温,随着Java SE 5和Java SE 6的推出,Java的未来更显得无比辉煌。但以Java为基础的JSP在Java SE 5推出之前却一直抬不起头来,这最重要的原因就...
  • hdy007
  • hdy007
  • 2007年03月02日 17:26
  • 672

JSP和JSF合并 共同打造完美的Web应用

  Java在最近几年逐渐升温,随着Java SE 5和Java SE 6的推出,Java的未来更显得无比辉煌。但以Java为基础的JSP在Java SE 5推出之前却一直抬不起头来,这最重要的原因就...
  • newweapon
  • newweapon
  • 2007年03月03日 17:35
  • 551

JSP和JSF合并 共同打造完美的Web应用(转)

转自:http://www.chinannv.com/Net/2007-10/520.htm Java在最近几年逐渐升温,随着Java SE 5和Java SE 6的推出,Java的未来更显得无...
  • Nocky
  • Nocky
  • 2007年11月10日 07:00
  • 478

JSP和JSF合并 共同打造完美的Web应用

Java在最近几年逐渐升温,随着Java SE 5和Java SE 6的推出,Java的未来更显得无比辉煌。但以Java为基础的JSP在Java SE 5推出之前却一直抬不起头来,这最重要的原因就是J...
  • nanjingjiangb
  • nanjingjiangb
  • 2007年03月05日 16:21
  • 786

JSP和JSF合并 共同打造完美的Web应用-2

三、JSP如何响应JSF的请求 从上面的例子我们已经知道如何在JSP中使用JSF了,在这一部分让我们来看看在JSF是如何处理请求...
  • faith_zerg
  • faith_zerg
  • 2007年10月15日 17:05
  • 760

和JSF合并 共同打造完美的Web应用

和JSF合并 共同打造完美的Web应用2007-04-26 来自:java060515  [收藏到我的网摘]show_ads_zone(112);Java在最近几年逐渐升温,随着Java SE 5和J...
  • wqhzxy87812389
  • wqhzxy87812389
  • 2007年05月07日 10:18
  • 332

JSP牵手JSF打造完美的Web应用

 Java在最近几年逐渐升温,随着Java SE 5和Java SE 6的推出,Java的未来更显得无比辉煌。但以Java为基础的JSP在Java SE 5推出之前却一直抬不起头来,这最重要的原因就是...
  • sdycczp
  • sdycczp
  • 2009年03月03日 19:45
  • 292

打造我们心中永恒的m500

最经典的关于M500的帖子,转自http://bbs.tompda.com/thread-1691618-1-1.html郑重申明一下,我的帖子,我自己编辑整理制作的资料,只要不以盈利为目的,且主要目...
  • JefferyLee
  • JefferyLee
  • 2007年11月19日 16:10
  • 6569

JSP,Servlet,JSF 的区别

1.JSPJSP(JavaServer Pages) 是一种java视图技术,它运行在服务器上,允许我们写入模版文本(例如:客户端语言:HTML,CSS,JavaScript等)。JSP支持tagli...
  • taxueguilai1992
  • taxueguilai1992
  • 2015年11月06日 16:12
  • 2486

JSP和JSF双剑合并,打造完美Web应用

  Java在最近几年逐渐升温,随着Java SE 5和Java SE 6的推出,Java的未来更显得无比辉煌。但以Java为基础的JSP在Java SE 5推出之前却一直抬不起头来,这最重要的原因就...
  • hdy007
  • hdy007
  • 2007年01月12日 13:06
  • 634
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:JSP和JSF合并 共同打造完美的Web应用
举报原因:
原因补充:

(最多只允许输入30个字)