编辑“JSF”

'''JSF'''(JavaServer Faces) 是一种用于构建[[Java]] [[Web]] [[应用程序]]的标准框架（是Java Community Process 规定的JSR-127标准）。它提供了一种以组件为中心的用户界面（[[UI]]）构建方法，从而简化了Java[[服务器端]]应用程序的开发。由于由Java Community Process (JCP) 推动，属于[[Java EE]] 5中的技术规范，而受到了厂商的广泛支持。

==概述==
JSF为JAVA的 Web应用用户界面的开发人员提供了标准的[[编程]]接口、丰富可扩展的UI组件库（一个核心的[[JSP]]标记库用来处理事件、执行验证以及其他非UI相关的操作和一个标准的[[HTML]]标记库来表示UI组件）、事件驱动模型等一套完整的Web应用框架，通过JSF ，您可以在页面中轻松自如地使用 WEB 组件、捕获用户行为所产生的事件、执行验证、建立页面导航等操作，当使用支持JSF的开发工具来开发 JSF 应用的时候，一切将会变得异常简单，[[GUI]]方式拖放组件、修改组件属性、建立组件间关联以及编写事件侦听器等等 

===JSF好处===
引入了基于组件和事件驱动的开发模式，使开发人员可以使用类似于处理传统界面的方式来开发Web应用程序。提供了行为与表达的清晰分离。 不用特别的[[脚本]]语言或者标记语言来连接UI组件和Web层。JSF技术[[API]]被直接分层在Servlet API的顶端。 技术为管理组件状态提供一个丰富的体系机构、处理组件[[数据]]、确认用户输入和操作事件。

===JSF应用程序===
典型的JSF应用程序包含下列部分：
*一组JSP页面
*一组后台bean（为在一个页面上的UI组件定义的属性和函数的[[JavaBean]]组件）
*应用程序配置资源文件（定义页面导航规则、配置bean和其它的自定对象，如自定义组件）
*部署描述文件（web.xml）
*一组由应用程序开发者创建的自定义对象（有可能）
*一些可能包含自定义组件、约束、转换器或者监听器的对象
*为在页面中表现自定义对象的一组自定义tag
包含JSP页面的JSF应用程序也使用由为了表现UI组件和在页面上的其他对象的JSF技术而定义的标准的tag库。

===应用程序开发角色===
页面作者：使用JSF标记库创建页面。

应用程序开发者：编写自定义转换器、约束、监听器和后台bean。

组件作者：创建自定义UI组件和实施者（renderer）。

应用程序建造者：配置应用程序，包括定义导航规则、配置自定义对象和创建部署描述文件。

==JSF体系结构==
===JSF的MVC实现===
JSF的主要优势之一就是它既是 Java Web 用户界面标准又是严格遵循模型-视图－控制器 ([[MVC]]) 设计模式的框架。用户界面[[代码]]（视图）与应用程序数据和逻辑（模型）的清晰分离使 JSF应用程序更易于管理。为了准备提供页面对应用程序数据访问的JSF上下文和防止对页面未授权或不正确的访问，所有与应用程序的用户交互均由一个前端“Faces”servlet（控制器）来处理。

===JSF 生命周期===
Faces Controller servlet充当用户和JSF应用程序之间的纽带。它在明确限定的JSF生命周期（规定了用户请求之间的整个事件流）的范围内工作。例如，一收到访问 JSF 应用程序的初始 Web 请求，Faces Controller servlet 便通过首先准备 JSF 上下文（存放所有应用程序数据的一个 Java 对象）来处理请求。然后控制器把用户指引到所请求的页面。该页面通常使用简单的表达式语言来处理来自 JSF 上下文的应用程序数据。一收到后续请求，控制器就更新所有模型数据（假设输入了新数据）。JSF 开发人员可以通过编程的方式在应用程序运行期间随时访问整个 JSF 生命周期，从而可以随时对应用程序的行为进行高度控制。

===JSF的用户界面组件===
JavaServer Faces 的真正威力在于它的用户界面组件模型。在该模型中，应用程序完全用组件集合构建，这些组件可以针对多种客户端类型用不同的方式来进行显示。与其他专有技术（如 [[ASP.Net]]）有点类似，JSF 的 UI 组件模型技术使开发人员能够使用预先构建的用户界面 (UI) 组件来构建 Web 用户界面（而非完全从头构建用户界面），从而提供了前所未有的开发效率。JSF UI 组件有多种形式，可以简单到只是显示文本的 outputLabel，或者复杂到可以表示来自数据集合（如[[数据库]]表）的表格化数据的 dataTable。

JavaServer Faces 规范在其参考实施中提供了一组基本 UI 组件，这些组件本身是非常有用的。它们包括两个组件库，即“HTML”组件库 — 它大部分映射了标准的 HTML 输入元素；以及“核心”库 — 它辅助常见的应用程序开发任务（如，国际化和验证/转换输入数据）。除了提供一个基本 UI 组件库之外，JSF API 还提供了扩展和创建定制 JSF UI 组件的功能，从而在基本组件之上提供更多功能。

===其他用户界面组件库===
由于 JSF API 的丰富性和灵活性，许多 Java 开发人员开始创建新的 JSF 组件库和实现。[[Oracle]] 的 ADF Faces 是一个完全符合 JSF 规范的组件库，它为 JSF 应用程序开发提供了一组广泛的增强 UI 组件。这些组件包括针对每种客户端类型的多种呈现器、高级表格、颜色和日期选择器以及大量通用组件（如菜单、命令按钮、转移选择器和进度指示计）。

除了 Oracle 的 ADF Faces 之外，还有其他新的 JSF 组件库开始从[[开放源代码]]社区和[[软件]]供应商社区中出现。MyFaces就是一个新 JSF UI 组件库的例子，它通过 [[Apache]] 作为一个开放源代码项目提供的。Myfaces 还是对 JSF 基本 UI 组件的增强，它拥有更广泛的 UI 功能，如集成的 Tiles 支持、支持 J[[avascript]] 的菜单和树控件。

==JSF程序==
JSF只是J2EE的一个标准，是一套接口集和一些基本实现，要使用JSF需要下载jsf的实现，可以到JSF 官方网站的 下载区 下载参考实现，也可以到 apache 下载 myfaces,这里以使用[[SUN]]的参考实现为例，在下载压缩文件并解压缩之后，将其 lib 目录下的 jar 文件复制至您的Web应用程序的/WEB-INF/lib目录下，另外您还需要 jstl.jar 与 standard.jar 文件，这些文件您可以在 sample 目录下的应用中找到，建好我们的应用目录结构：
<pre>   hellojsf
   |-- build.xml
   |-- src
   |-- WEB-INF
   |----|-- web.xml
   |----|-- faces-config.xml
   |----|-- classes
   |----|-- lib
   |----|----|--jsf-impl.jar
   |----|----|--jsf-api.jar
   |----|----|--commons-digester.jar
   |----|----|--commons-collections.jar
   |----|----|--commons-beanutils.jar
   |----|----|--commons-logging.jar
   |----|----|--standard.jar
   |----|----|--jstl.jar</pre>
可能只有faces-config.xml，它是jsf的基本配置文件，后面就可以看到它的作用。

<pre>   //build.xml
<project name="helloapp" default="compile" basedir=".">

<!-- ================= Property Definitions ==================== -->
<property name="src.home" value="${basedir}/src" />
<property name="classes.home" value="${basedir}/WEB-INF/classes" />
<property name="lib.home" value="${basedir}/WEB-INF/lib" />

<!-- ================= "compile" Target ==================== -->
<target name="compile">
 <javac srcdir="${src.home}" destdir="${classes.home}" debug="on">
  <classpath>
   <fileset dir="${lib.home}">
    <include name="*.jar"/>
   </fileset>
  </classpath>
 </javac>
</target>

</project></pre>

下面我们就开始写程序了，没有什么复杂逻辑，不用细说他的流程，直接写了。
<pre>
   //hello.jsp 保存在根目录下
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<f:view>
 <html>
  <head>
   <title>
   JSF in Action - Hello, world!
   </title>
  </head>
  <body>
   <h:form id="welcomeForm">
    <h:outputText id="welcomeOutput"
     value="Welcome to JavaServer Faces!"
     style="font-family: Arial, sans-serif; font-size: 24;
     color: green;"/>
    <p>
    <h:message id="errors" for="helloInput" style="color: red"/>
    </p>
    <p>
    <h:outputLabel for="helloInput">
     <h:outputText id="helloInputLabel" value="Enter number of controls to display:"/>
    </h:outputLabel>
    <h:inputText id="helloInput" value="#{helloBean.numControls}" required="true">
     <f:validateLongRange minimum="1" maximum="500"/>
    </h:inputText>
    </p>
    <p>
    <h:panelGrid id="controlPanel"
     binding="#{helloBean.controlPanel}"
     columns="20" border="1" cellspacing="0"/>
    </p>
    <h:commandButton id="redisplayCommand" type="submit" value="Redisplay" actionListener="#{helloBean.addControls}"/>
    <h:commandButton id="goodbyeCommand" type="submit" value="Goodbye" action="#{helloBean.goodbye}" immediate="true"/>
   </h:form>
  </body>
 </html>
</f:view>
</pre>
从这个页面可以看出，jsf 就是用他自己的UI组件代替了html标签，又加了些特有的属性，很容易理解，值得注意的是，所有组件都要定义在<f:view></f:view>之内，熟悉jsp的可能对”#{helloBean.numControls}“感觉很熟悉，不同的是这个是以”#“开头的，”binding“属性的值是个jsf el 表达式，它指定了helloBean类中的controlPanel方法可以直接对此组件进行操作，h:commandButton 是按钮组件，可以产生 action event, 他的 actionListener 属性制定了用helloBean类中的addControls方法来处理这个action event，其他的都比较容易理解，来看下个页面。
<pre>   //goodbye.jsp 保存在根目录下
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<f:view>
 <html>
  <head>
   <title>
   JSF in Action - Hello, world!
   </title>
  </head>
  <body>
   <h:form id="goodbyeForm">
   <p>
   <h:outputText id="welcomeOutput" value="Goodbye!"
    style="font-family: Arial, sans-serif; font-size: 24;
    font-style: bold; color: green;"/>
   </p>
   <p>
   <h:outputText id="helloBeanOutputLabel" value="Number of controls displayed:"/>
   <h:outputText id="helloBeanOutput" value="#{helloBean.numControls}"/>
   </p>
   </h:form>
  </body>
 </html>
</f:view></pre>

这个页面更简单，只是一些输出。

在 hello.jsp goodbye.jsp 中都通过 jsf el 表达式引用了一个 backing bean, 叫 helloBean, 他包括了我们这个应用所需的一切
<pre>   //HelloBean.java 保存在 src 下
package org.jia.hello;

import javax.faces.application.Application;
import javax.faces.component.html.HtmlOutputText;
import javax.faces.component.html.HtmlPanelGrid;
import javax.faces.context.FacesContext;
import javax.faces.event.ActionEvent;
import java.util.List;

public class HelloBean
{
 private int numControls;
 private HtmlPanelGrid controlPanel;

 public int getNumControls()
 {
  return numControls;
 }
 public void setNumControls(int numControls)
 {
  this.numControls = numControls;
 }
 public HtmlPanelGrid getControlPanel()
 {
  return controlPanel;
 }
 public void setControlPanel(HtmlPanelGrid controlPanel)
 {
  this.controlPanel = controlPanel;
 }
 public void addControls(ActionEvent actionEvent)
 {
  Application application = FacesContext.getCurrentInstance().getApplication();
  List children = controlPanel.getChildren();
  children.clear();
  for (int count = 0; count < numControls; count++)
  {
   HtmlOutputText output = (HtmlOutputText)application.createComponent(HtmlOutputText.COMPONENT_TYPE);
   output.setValue(" " + count + " ");
   output.setStyle("color: blue");
   children.add(output);
  }
 }
 public String goodbye()
 {
  return "success";
 }
}</pre>
jsf 的 backing bean 很简单，不需要继承于某个特定[[类]]，只是一个包含事件处理方法的javabean
   
这里面最复杂的就是 addControls 方法了，它是一个 action listener 方法，因为他接收了一个唯一的参数 ActionEvent，在 hello.jsp 中：”<h:commandButton id="redisplayCommand" type="submit" value="Redisplay" actionListener="#{helloBean.addControls}"/>“，这句话告诉 jsf，当用户点击"Redisplay"按钮时jsf会用这个方法来处理 action event

goodbye方法象 addControls 一样，是 event listener 的一种类型，但他是于 jsf 的导航系统联系起来的，所以他的工作就是返回一个[[字符串]]或逻辑输出，这样导航系统就可以决定下一个要加载的页面，这一类的方法叫做 action methods. 在 hello.jsp 中：”<h:commandButton id="goodbyeCommand" type="submit" value="Goodbye" action="#{helloBean.goodbye}" immediate="true"/>“，当用户点击”Goodbye“按钮时，goodbye方法会被执行，他只是返回"success"，在配置文件中这个输出与某个页面相联系，下面就来看看配置文件faces-config.xml
<pre>   //faces-config.xml

<?xml version="1.0"?>
<!DOCTYPE faces-config PUBLIC
"-//Sun Microsystems, Inc.//DTD JavaServer Faces Config 1.0//EN"
"http://java.sun.com/dtd/web-facesconfig_1_0.dtd">
<faces-config>
 <managed-bean>
  <description>The one and only HelloBean.</description>
  <managed-bean-name>helloBean</managed-bean-name>
  <managed-bean-class>org.jia.hello.HelloBean</managed-bean-class>
  <managed-bean-scope>session</managed-bean-scope>
 </managed-bean>
 <navigation-rule>
  <description>Navigation from the hello page.</description>
  <from-view-id>/hello.jsp</from-view-id>
  <navigation-case>
   <from-outcome>success</from-outcome>
   <to-view-id>/goodbye.jsp</to-view-id>
  </navigation-case>
 </navigation-rule>
</faces-config></pre>

jsf 象大多数框架一样，有一个配置文件，在之中你可以定义导航规则、初始化javabean、注册你自己的jsf组件、验证器，和一些面向jsf应用其他方面的其他配置

在这个配置文件中定义了一个bean, 指定了他的名字（这个名字就是我们在页面中使用的名字），类全名，和使用范围。还定义了一个导航规则，hello.jsp有一个”Goodbye“按钮转到其他页，所以只有一个单独的navigation-case，当输出为”success"时，就会显示goodbye.jsp。

现在我们已经写完了页面，backing bean, 和配置文件，下面写完web.xml后就可以看到效果了
<pre>   //web.xml

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE web-app PUBLIC "-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN"
"http://java.sun.com/dtd/web-app_2_3.dtd">
<web-app>
 <display-name>hello world</display-name>
 <description>
  Welcome to JavaServer Faces.
 </description>
 <servlet>
  <servlet-name>Faces Servlet</servlet-name>
  <servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
  <load-on-startup>1</load-on-startup>
 </servlet>
 <servlet-mapping>
  <servlet-name>Faces Servlet</servlet-name>
  <url-pattern>/faces/*</url-pattern>
 </servlet-mapping>
 <welcome-file-list>
  <welcome-file>faces/hello.jsp</welcome-file>
 </welcome-file-list>
</web-app></pre>

FacesServlet 是做jsf 应用是一定要指定的，还设了默认页为 hello.jsp.

运行build, 启动web server, 在地址栏中打入应用地址，看到刚刚写的应用了吧，通过实际效果结合代码，相信已经对jsf 已经有一个基本认识了。

==相关条目==
*[[Struts]]
*[[Spring]]
*[[JRuby]]

==参考来源==
*http://zh.wikipedia.org/zh-cn/JavaServer_Faces
*http://www.oracle.com/technology/global/cn/tech/java/newsletter/articles/introjsf/index.html
*http://www.zhuoda.org/irini/58867.html

[[category:J2EE|J]]
[[category:框架|J]]