JSF在Web开发中的应用.ppt

《JSF在Web开发中的应用.ppt》由会员分享，可在线阅读，更多相关《JSF在Web开发中的应用.ppt（79页珍藏版）》请在三一办公上搜索。

1、第四章 JSF入门,信息类专业课程,西北农林科技大学,主要内容,JSF简介JSF入门JSF标签JSF开发环境,Web开发技术,Web架构用超文本技术（HTML）实现信息与信息的连接；用统一资源定位技术（URI）实现全球信息的精确定位；用新的应用层协议（HTTP）实现分布式的信息共享。静态 动态客户端技术HTML、Java Applets、JavaScript、ActiveX、CSS、DHTML、XHTML服务端技术CGI（Common Gateway Interface）C、C+、Pascal Perl、PythonPHP、ASP、Servlet（JSP）+JavaBean,最新发展,Java

2、 Web框架Struts、Spring MVC、WebWork、TapestryJSFAJAX(Asynchronous JavaScript and XML)XHTML 和 CSS 的标准表示;使用文档对象模型DOM实现动态显示及用户交互;使用 XML、XSLT和XMLHttpRequest进行数据交换及操作;使用 javascript 将所有技术绑定在一起。Agile WebRuby on Rails Python（Django、TurboGears、Pylons）,二、JSF简介,什么是JSFJSF的特性JSF与其它框架的比较JSF实现JSF示例,什么是JSF,JavaServer Fa

3、ces(JSF)：符合JavaEE5标准的Java Web应用框架。目标：简化开发。JSF提供：标准的编程接口丰富可扩展的组件库一个核心的JSP标记库用来处理事件、执行验证以及其他非UI相关的操作（core）一个标准的HTML标记库来表示UI组件（html）事件驱动模型JSF通过IDE工具支持拖放式开发。,JSF的由来和目标,由来EJB2的失败非官方Web框架的兴起目标简化开发超越现有Web框架试图在不同的角度上提供网页设计人员、应用程序设计人员、组件开发人员解决方案，让不同技术的人员可以彼此合作又不互相干扰,JSF 体系结构,JSF 的主要优势之一就是它既是 Java Web 用户界面标准又

4、是严格遵循模型-视图控制器(MVC)设计模式的框架。用户界面代码（视图）与应用程序数据和逻辑（模型）的清晰分离使 JSF 应用程序更易于管理。为了准备提供页面对应用程序数据访问的 JSF 上下文和防止对页面未授权或不正确的访问，所有与应用程序的用户交互均由一个前端“Faces”servlet（控制器）来处理。,JSF的特性,技术特性 一流的UI组件和事件模型POJO依赖注入（又称控制反转）客户端独立性 使用或者不使用工具 可扩展的导航（类似于Struts导航，注：Page导航）强大的扩展能力（如Shale）完全的集成（如集成Spring、JPA）本地化和易理解性,JSF的特性,市场和商业特性

5、广泛的采用，包括SUN，Oracle，IBM，BEA，Apache，EDS 作为JavaEE 5.0的组成部分 大型第三方组件市场（iLog,Business Objects,Oracle,Sun,IBM)业内领先的工具支持（Sun Java Studio Creator,NetBeans，Oracle JDeveloper,IBM WSAD,BEA Workshop,Exadel Studio),与其它框架的比较（来自TSS）,JSF的优势,UI组件（UI-component）事件驱动模式用户界面到业务逻辑的直接映射 程序员和网页设计人员的分工 请求处理生命周期的多阶段划分 全面的用户自定义

6、支持 Web开发的官方标准之一大量的IDE工具支持,JSF实现,JSF是标准实现Sun JSF RIApache MyFaces组件库TomahawkADF Faces(from Oracle)Tobago,JSF示例,第一个JSF程序 请输入您的名称 名称:,二、JSF入门,第一个JSF程序JSF Expression Language 国际化（I18N）Managed Beans数据转换与验证事件处理,第一个JSF程序,JSF开发环境Eclipse WTPJSF插件JSF实现（MyFaces）TomcatManaged-BeanJSP页面Pages Navigation,JSF应用一：输入

7、页面,f:loadBundle basename=messages var=msg/,用于临时加载国际化资源的语言包,输出指定key对应的国际化消息,JSF应用一：输入页面,JSF应用二：开发托管Bean,从作用上看托管Bean类似struts2的Action，但作用模式不同。对于struts2的Action而言，应用通过表单提交方式把请求提交到struts2的Action；但JSF的托管Bean，系统直接将JSF中的UI组件的行为绑定到托管Bean的属性或方法。如：该文本框的行为绑定到login Bean的name属性。该按钮的行为直接绑定到login Bean的valid方法上,JSF应用

8、二：开发托管Bean,public class LoginBean/下面的三个属性都会直接与JSF标签绑定private String name;private String pass;private String err;./该方法被绑定到UI组件（按钮）的action属性public String valid()if(name.equals(“zhangsan),JSF应用三：定义导航规则,JSF以导航规则来决定逻辑视图与物理视图资源之间的对应关系；JSF导航规则可以指定系统从哪个页面开始，以该页面的提交按钮绑定的值作为 逻辑视图；JSF使用标准的配置文件定义导航规则；JSF允许每个表单域

9、单独触发事件，JSF常用的两类事件：ValueChange事件：表单域的值发生改变时触发该事件；Action事件：用户单击按钮或超链接时触发这类事件。,JSF应用三：定义导航规则,/login.jspsuccess/greeting.jspfailure/login.jsp,faces-config-nav.xml,JSF应用四：解读JSF配置,对于大部分JSF初级开发者而言，常作的两件事是：定义托管Bean，配置XML文件。配置核心控制器 Web应用基本上是请求-响应架构，即：用户向Web应用发请求，Web应用处理请求，处理完成后将请求送回客户端。JSF与传统的MVC框架一样，也提供了一个核

10、心控制器负责处理所有用户请求，即,它就是JSF的核心控制器。FacesServlet是一个标准的Servlet，因此，它的配置与普通Servlet没有太大区别，同样是先配置Servlet，再配置Servlet映射的URL，配置文件时web.xml。,JSF应用四：解读JSF配置,FacesServlet1FacesServlet*.jsf,配置FacesServlet的代码片段如下：,上面配置片段指定使用FacesServlet来拦截所有已.jsf结尾的请求，值得注意的是 FacesServlet拦截的URL不一定是*.jsf,完全可以有用户随意指定。如：*.faces、*.do等。,JSF应

11、用四：解读JSF配置,/WEB-INF/faces-config-beans.xml,/WEB-INF/faces-config-nav.xmlclient,：为整个web用于配置参数,JSF应用四：解读JSF配置,JSF有效参数名及其作用如下：,：指示是在客户端（client）还是在服务器端（server）保存UI组件的状态。JSF有保存页面中组件状态的能力，以便在页面被重新显示时记住用户输入的信息。组件状态可以保存在客户端也可保存在服务器端，这取决于 参数的设置值。可能的取值是client 和 server（默认值）。,：该参数指定JSF映射视图资源时的默认后缀名，默认值是.jsp,不需要

12、改变参数的值。,JSF应用四：解读JSF配置,：该参数指定JSF配置文件的存放位置。默认情况下JSF会自动加载位于WEB_INF下的faces-config.xml文件。如果包含多个JSF配置文件，则需要指定该参数，通过逗号分割不同的（相对路径）配置文件；如果只有一个JSF配置文件，且文件为位于WEB_INF下的faces-config.xml，则可以省略该参数。,：该参数指定JSF所管理的生命周期实例的标识符，该参数通常无需修改。,JSF应用四：解读JSF配置,：该参数用于指定是否需要验证自定义组件。当JSF应用中定义了自定义组件、转换器、校验器时，可以设置应用启动时验证这些自定义组件。该参

13、数的值只能是true或false。,：该参数指定是否需要验证JSF应用中的xml文件。,：当状态保存方法设置为server时，控制会话中保存的视图数量，当设置为-1时表示没有限制。,JSF配置文件结构,JSF配置文件根元素都是元素，JSF应用配置总体分为三种：分别针对日常应用开发，UI扩展开发（编写组件，呈现器，转换器或者验证器）和高级开发。最常见的两个元素是：:JSF应用中所有托管Bean都在该元素下配置、管理。:该元素用于管理JSF应用的导航规则。,JSF配置文件结构,三、JSF Expression Language,搭配 JSF 标签来使用，是用来存取数据对象的一个简易语言。以#开始，

14、将变量或运算式放置在 与 之间。#userBean.nameEL的变量名也可以程序执行过程中所声明的名称，或是JSF EL预定义的隐含对象。#param.name对于Map类型对象，可以使用.运算符指定key值来取出对应的value，也可以使用 与 来指定。#paramname#someBean.someMapuser.name 如果变量是List类型或阵列的话，则可以在 中指定索引。#someBean.someList0,也可以指定字面常数，对于true、false、字符串、数字，JSF EL会尝试进行转换。在声明变量名称时，要留意不可与JSF的保留字或关键字同名。true false nu

15、ll div mod and or not eq ne lt gt le ge instanceof empty 在EL中可以直接进行一些算术运算、逻辑运算与关系运算。算术运算符：加法(+),减法(-),乘法(*),除法(/or div)与余除(%or mod)三元运算：(expression?result1:result2)逻辑运算：and(或&)、or(或!)、not(或!)关系运算：小于Less-than(or gt)、小于或等于Less-than-or-equal(=or ge)、等于Equal(=or eq)、不等于Not Equal(!=or ne)EL运算符的执行优先顺序与Jav

16、a运算符对应,三、JSF Expression Language,四、国际化信息,JSF的国际化（Internationalization，简写I18N）信息处理是基于Java对国际化的支持，可以在一个信息资源文件中统一管理信息资源，资源文件的名称是.properties，而内容是名称与值的配对。资源文件名称由basename加上语言与地区来组成：basename.properties basename_en.properties basename_zh_CN.properties信息资源文件必须是ISO-8859-1编码，所以对于非西方语系的处理，必须先将之转换为Java Unicode E

17、scape格式：nameText=名称 nameText=u540du79f0 使用标签来指定载入信息资源：,可以设定locale属性，直接指定所要使用的语系：也可以在faces-config.xml中设定语系：zh_CN en.甚至可以让使用者选择自己的语系：,四、国际化信息,五、Managed Beans,JSF使用 Bean 来达到逻辑层与表现层分离的目的，Bean的管理集中在配置文件中，只要修改配置文件，就可以修改Bean之间的相依关系。Backing Bean，Glue Bean：在真正的业务逻辑Bean及UI组件之间搭起桥梁，在Backing Bean中会呼叫业务逻辑Bean处理使

18、用者的请求，或者是将业务处理结果放置其中，等待UI组件取出当中的值并显示结果给使用者。,五、Managed Beans,在faces-config.xml中集中管理作用域：application：一直存活session：会话过程request：请求阶段none：需要时，临时,Managed-Bean类型,Beans的配置与设定,JSF预定义会读取faces-config.xml中关于Bean的定义 可在web.xml中利用javax.faces.CONFIG_FILES参数指定自定义文件：/WEB-INF/beans.xml.定义文件可以有多个，中间以“,”区隔：/WEB-INF/naviga

19、tion.xml,/WEB-INF/beans.xml,Beans的配置与设定,Bean的基本定义：名称 类 存活范围 可选设置属性的初始值 user#user,Beans上的List,someProperty 1 2 3,Beans上的Map,someProperty someKey1 100 someKey2 200,访问Managed Beans,如果要在其它类中取得Bean对象，则可以先取得，它代表了JSF目前的执行环境对象，接着尝试取得对象，从中取得指定的Bean对象：FacesContext context=FacesContext.getCurrentInstance();Val

20、ueBinding binding=context.getApplication().createValueBinding(#user);UserBean user=(UserBean)binding.getValue(context);取得Bean的某个属性：FacesContext context=FacesContext.getCurrentInstance();ValueBinding binding=context.getApplication().createValueBinding(#user.name);String name=(String)binding.getValue(

21、context);,六、JSF标签,标准标签输出类标签输入类标签命令类标签选择类标签其他标签表格处理,JSF标准标签,输出（Outputs）其名称以output作为开头，作用为输出指定的信息或绑定值。输入（Inputs）其名称以input作为开头，其作用为提供使用者输入框。命令（Commands）其名称以command作为开头，其作用为提供命令或链接按钮。选择（Selections）其名称以select作为开头，其作用为提供使用者选项的选取。其它 包括了form、message、messages、graphicImage等等未分类 的标签。,标准HTML标签的属性,输出类标签,outputLa

22、bel产生 HTML标签，使用for属性指定组件的client ID，例如：outputLink产生 HTML标签，搭配可帮链结加上参数，所有的参数都会变成 name=value 的类型附加在链接后，value所指定的内容也可以是JSF EL绑定。例如：outputFormat产生指定的文字信息，可以搭配来设定信息的参数以格式化文字信息，例如：outputText简单的显示指定的值或绑定的信息，例如：,输入类标签,inputText显示单行输入框，即输出 HTML标签，其type属性设定为text，例如：inputTextarea显示多行输入文字区域，即输出 HTML标签，例如：inputSe

23、cret显示密码输入框，即输出 HTML标签，其type属性设定为password，例如：inputHidden隐藏输入框，即输出 HTML标签，其type属性设定为hidden，隐藏输入框的值用于保留一些信息于客户端，以在下一次发送表单时一并提交，例如：,命令类标签,commandButton显示一个命令按钮，即输出 HTML标签，其type属性可以设定为button、submit或reset，预设是submit，按下按钮会触发.ActionEvent，例如：commandLink产生超链接，会输出 HTML标签，而href属性会有#，而onclick属性会含有一段JavaScript程序，

24、这个JavaScript的目的是按下链接后自动提交表单，具体来说其作用就像按钮，但外观却是超链接，例如：,选择类标签,选取框单选单选按钮单选列表单选菜单复选复选框复选列表复选菜单,选择类标签的选项,itemLabelitemValue 或者value绑定一个传回javax.faces.model.SelectItem的方法 value绑定至一个提供传回SelectItem的列表（数组）的方法 SelectItem:value,labelvalue绑定至一个提供传回Map对象的方法Map:label,value,其他标签,或 图片 排版 本体间只能包括JSF组件，如果想要放入非JSF组件，例如简

25、单的样版（template）文字，则要使用 包括住。包装组件,表格处理,配合实现以表格的方式显示数据 header与footer分别表示表头和表尾使用DataModel处理复杂的数据,七、事件处理,动作事件（Action Event）即时事件（Immediate Event）值变事件（Value Change Event）阶段事件（Phase Event）,动作事件（Action Event）,通过action属性绑定一个事件方法：通过actionListener属性绑定一个事件方法，action绑定返回结果的方法：用标签向组件注册事件监听器（实现.ActionListener接口），acti

26、on绑定返回结果的方法：,即时事件（Immediate Event）,即时事件是指JSF视图组件在取得请求中该取得的值之后，即立即处理指定的事件，而不再进行后续的转换器处理、验证器处理、更新模型值等流程。,值变事件（Value Change Event）,使用者改变了JSF输入组件的值后提交表单，就会发生值变事件，丢出一个对象 直接设定JSF输入组件的valueChangeListener属性：实现接口，并定义其processValueChange()方法；然后在JSF页面上使用标签，并设定其type属性：,阶段事件（Phase Event）,重建视图（Restore View）依客户端传来的

27、session数据或服务器端上的session数据，重建JSF视图组件。套用请求值（Apply Request Values）JSF视图组件各自获得请求中的属于自己的值，包括旧的值与新的值。执行验证（Process Validations）转换为对象并进行验证。更新模型值（Update Model Values）更新Bean或相关的模型值。唤起应用程序（Invoke Application）执行应用程序相关逻辑。绘制响应页面（Render Response）对先前的请求处理完之后，产生页面以反应客户端执行结果。,阶段事件（Phase Event）,在每个阶段的前后会引发.PhaseEvent实

28、现，并向登记这个Listener，便可捕获事件getPhaseId()、beforePhase()与afterPhase()PhaseId：PhaseId.RESTORE_VIEWPhaseId.APPLY_REQUEST_VALUESPhaseId.PROCESS_VALIDATIONSPhaseId.UPDATE_MODEL_VALUESPhaseId.INVOKE_APPLICATIONPhaseId.RENDER_RESPONSE PhaseId.ANY_PHASE,八、数据转换与验证,转换器（Converter）协助模型与视图之间的数据转换验证器（Validator）协助进行语意检验

29、（Semantic Validation）,1.标准转换器,HTTP字符串 Java对象对于基本数据类型（primitive type）或是其Wrapper类，JSF会使用、等自动进行转换对于 BigDecimal、BigInteger，则会使用javax.faces.BigDecimal、自动进行转换对于DateTime、Number，可以使用、标签进行转换，它们各自提供有一些简单的属性，可以让我们在转换时指定一些转换的格式细节：,2.自定义转换器,实现接口，这个接口有两个要实现的 方法：public Object getAsObject(FacesContext context,UICom

30、ponent component,String str);public String getAsString(FacesContext context,UIComponent component,Object obj);在faces-config.xml中注册:在JSF页面中通过converter-id使用转换器:,3.标准验证器,语法检验（Synatic Validation）检查使用者输入的数据是否合乎我们所要求的格式，最基本的就是检查使用者是否填入了栏目值，或是栏目值的长度、大小值等等是否符合要求。三种标准验证器：,4.自定义验证器,实现接口中的validate()方法，如果验证错误，则

31、丢出一个ValidatorException，它接受一个FacesMessage对象，这个对象接受三个参数，分别表示信息的严重程度（INFO、WARN、ERROR、FATAL）、信息概述与详细信息内容，这些信息将可以使用或标签显示在页面上。在faces-config.xml中注册验证器的标识（Validater ID）。通过标签并设定validatorId属性来使用自定义验证器。,5.错误信息处理,预定义的错误信息可以使用或标签显示出来通过提供一个信息资源文件可以修改预定义的错误 信息MyFaces提供了支持中文的错误信息文件Messages_zh_CN.properties 也可以在程序中使

32、用FacesMessage来提供信息,6.自定义转换/验证标签,使用标签来设定属性：在自定义验证器中用下面语句获取属性：String pattern=(String)component.getAttributes().get(pattern);也可以开发自己的一组验证标签，并提供相关属性设定：,九、传统请求/响应驱动的处理周期,请求/响应驱动的处理周期,传统请求/响应处理模型的不足,控制器缺乏对页面的控制力控制能力仅限于页面导航页面缺乏对模型的控制力原则上页面只应负责从模型中提取数据并显示，若直接设置模型数据，则绕过了控制器中的转换校验逻辑。页面与控制器之间缺乏有效沟通基于面向对象的控制器难以

33、适应基于文本流的页面。沟通形式局限于传递简单的请求参数，修改共享数据（例如JavaBean或Session属性等）页面对控制器的通信需要由客户端发起请求，沟通形式受限于传输协议（例如HTTP的GET方式）对一个请求/响应循环的逻辑缺乏细致划分，导致校验、转换、展现的代码纠缠在一起。程序员必须自己去关心进行这些动作的时机，次序以及出错后的行为。,JSF提供的解决方案,JSF引擎负责维护视图的组件树模型类似于浏览器的DOM模型，JSF组件树模型为基于文本流的视图提供了一个面向对象的映射。控制器可以访问、修改组件树中的元素，从而获取请求发起时的视图状态，或者影响最终的响应结果。JSF引擎负责发起校验

34、，转换行为，程序员只需提供相关的逻辑，而不需要关心时机同时，JSF实现提供了常用的校验与转换逻辑。引入延迟求值EL表达式，令视图可以以受控的方式调用、修改模型。JSF引擎管理对延迟求值EL表达式的赋值，调用等明确划分首次请求与postback（对同一个视图的后续请求），JSF引擎管理postback时的组件树与模型更新。统一了视图与控制器，从而消除了沟通问题。,JSF请求处理生命周期,一次请求处理生命周期的范围是一个请求/响应循环请求处理生命周期由六个阶段组成恢复视图阶段（Restore View Phase）应用请求值阶段（Apply Request Value Phase）处理验证阶段（P

35、rocess Validations Phase）更新模型值阶段（Update Model Value Phase）调用应用程序阶段（Invoke Application Phase）渲染响应阶段（Render Response Phase）首次请求时只执行恢复视图阶段与渲染响应阶段，postback时原则上顺序执行全部六个阶段。引擎实现与用户应用程序可以在任一阶段中通知引擎跳过某些阶段FacesContext.getCurrentInstance().renderResponse()本阶段执行完毕后直接跳到渲染响应阶段FacesContext.getCurrentInstance().res

36、ponseComplete()本阶段执行完毕后直接终止当前生命周期,JSF请求处理生命周期简图,JSF请求处理生命周期各阶段(一),恢复视图阶段首次请求时：根据页面文件创建组件树通知JSF引擎直接进入渲染响应阶段Postback时：根据客户端提交或保存在服务器会话中的ViewState（视图状态）恢复组件树,JSF请求处理生命周期各阶段（二）,应用请求值阶段在此阶段，JSF引擎对请求所提交数据进行解码，获得页面组件的状态值（例如textField中填入的值）处理校验阶段在此阶段，JSF引擎对组件的原始状态值进行转换和校验。若出现转换或校验失败，JSF引擎将错误消息加入队列，将组件的valid属

37、性设为false，并通知JSF在本阶段完毕之后直接跳到渲染响应阶段。应用模型值阶段若生命周期流程顺利到达这个阶段，说明请求中的信息在语法与业务语义上均正确（由之前的验证过程保证）。JSF引擎将这些值更新到与组件绑定的模型对象中。,JSF请求处理生命周期各阶段（三）,调用应用程序阶段若生命周期流程顺利到达这个阶段，说明所有模型对象的状态已经根据请求中的输入进行了更新。JSF负责调用应用程序中定义的各种事件方法，主要是绑定的action方法。渲染响应阶段在此阶段，JSF引擎使用配置指定的渲染包（Render Kit）将组件树渲染为输出格式。通过选用不同的Render Kit，这个输出格式可以有很多

38、形式，例如静态Html页面、带ajax支持的Html页面、xml，甚至是flash等等。目前AOM主要的输出格式是带ajax支持的Html页面。,影响生命周期执行顺序的一些方式,在生命周期中的任何阶段中调用当前请求的FacesContext实例的renderResponse()方法，将通知JSF引擎在本阶段执行完毕后直接跳到渲染响应阶段。在生命周期中的任何阶段中调用当前请求的FacesContext实例的responseComplete()方法，将通知JSF引擎在本阶段执行完毕后结束本次生命周期。若组件的immediate属性为true，则这个组件的转换和校验动作将在应用请求值阶段执行（原来是

39、在处理验证阶段执行），其动作事件将在应用请求值阶段结束后立刻被分发（原来是在调用应用程序阶段被分发）。此属性默认为false。若这个组件出现验证错误，将跳过其他immediate属性为false的组件的验证。这个组件有机会在其验证或动作事件中调用renderResponse()方法或responseComplete()方法，跳过所有其他immediate属性为false的组件的验证与动作事件调用。,JSF引擎会在每个生命周期的开始和结束时分别广播生命周期事件。通过向JSF引擎注册生命周期监听器，就可以监听到这些事件并触发处理。应用程序通过实现接口定义一个生命周期监听器。在public Phas

40、eId getPhaseId()方法中返回这个监听器所监听的生命周期阶段例如return PhaseId.RESTORE_VIEW;返回PhaseId.ANY_PHASE将监听所有生命周期阶段事件在public void beforePhase()方法中加入在生命周期开始时的处理在public void afterPhase()方法中加入在生命周期结束时的处理需要在faces-config.xml中注册此监听器,生命周期阶段监听器,JSF开发环境,支持JSF的IDEJSF组件库JSF工具,支持JSF的IDE,Eclipse WTPJava Studio CreatorNetBeansVisualWebJDeveloperIBM WSADBEA WorkShop for JSFExadel Studio,JSF组件库,TomahawkTobagoTrinidad（Oracle ADF-Faces）Apusic JSF,JSF扩展,FaceletsJSF-SpringAjax4JSF,