JSF基础入门

1. JSF是什么：在不同的角度上提供网页设计人员、应用程序设计人员、组件开发人员解决方案，让不同技术的人员可以彼此合作又不互相干扰的前端技术框架，它严格遵循MVC设计模式。其实就是和structs几乎一模一样，配置上面的做法也差不多。

2. JSF 生命周期：FacesServlet 充当用户和 JSF 应用程序之间的纽带。它在明确限定的 JSF 生命周期（规定了用户请求之间的整个事件流）的范围内工作。

1．当JSF页面上的一个事件发生时（比如：用户单击了一个按钮），事件通知通过HTTP发往服务器。服务器端使用FacesServet这个特殊的Servlet处理该通知。

2． FacesServlet一接收到用户的请求就创建一个FacesContext对象（JSF上下文，它存放了应用程序的所有数据）。在处理过程中，主要修改的就是这个FaceContext对象。

3．接着就是处理过程，处理器是一个叫作Lifecycle的对象。FacesServet把控制权转交给Lifecycle对象。该对象分6个阶段来处理FacesContext对象以生成响应，最后将响应发回客户端。

3. 如何使用JSF

1. 添加jar包

2.配置web.xml

<?xml version="1.0" encoding="ISO-8859-1"?>
 <web-app xmlns="http://java.sun.com/xml/ns/j2ee"
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee
    http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd"
    version="2.4">

    <description>
        JSF Demo
    </description>
    <display-name>JSF Demo</display-name>
    <servlet>
<!--核心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>index.html</welcome-file>
    </welcome-file-list>
 </web-app>

3.添加/WEB-INF/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>
 <!-- 定义页面流程 -->
    <navigation-rule>
    <!-- 请求来自哪里 -->
        <from-view-id>/index.jsp</from-view-id>
        <!-- 在verify()方法中，我们检查使用者名称与密码，它传回一个字符串，"failure"表示登入错误，
                           并会设定错误讯息，而"success"表示登入正确，这个传回的字符串将决定页面的流程 -->
        <navigation-case>
            <from-outcome>success</from-outcome>
            <to-view-id>/welcome.jsp</to-view-id>
        </navigation-case>
        <navigation-case>
            <from-outcome>failure</from-outcome>
            <to-view-id>/index.jsp</to-view-id>
        </navigation-case>

    </navigation-rule>

    <managed-bean>
        <!--jsp页面引用的名字-->
        <managed-bean-name>user</managed-bean-name>
        <!-- 对应哪一个类-->
         <managed-bean-class>
             lcy.UserBean
         </managed-bean-class>
        <managed-bean-scope>session</managed-bean-scope>
    </managed-bean>
 </faces-config>

4. 处理类 UserBean.java

package lcy;
public class UserBean {
	private String name;
    private String password;
    private String errMessage;

    public void setName(String name) {
        this.name = name;
    }

    public String getName() {
        return name;
    }

    public void setPassword(String password) {
        this.password = password;
    }

    public String getPassword() {
        return password;
    }

    public void setErrMessage(String errMessage) {
        this.errMessage = errMessage;
    }

    public String getErrMessage() {
        return errMessage;
    }

    public String verify() {
        if(!name.equals("lcy") ||
           !password.equals("123")) {
            errMessage = "名称或密码错误";
            return "failure";
        }
        else {
            return "success";
        }
    }

 }

5.前台页面 index.jsp

<%@taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
 <%@taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
 <%@page contentType="text/html;charset=utf-8"%>
 <html>
 <head>
 <title>第一个JSF程序</title>
 </head> 
 <body>
     <f:view>
        <h:form>
            <h3>请输入您的名称</h3>
            <h:outputText value="#{user.errMessage}"/><p>
           名称: <h:inputText value="#{user.name}"/><p>
           密码: <h:inputSecret value="#{user.password}"/><p>
            <h:commandButton value="送出"
                             action="#{user.verify}"/>
        </h:form>
    </f:view>

 </body>
 </html>

6. welcome.jsp

<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
 <%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
 <%@page contentType="text/html;charset=Big5"%>
 <html>
 <head>
 <title>第一个JSF程序</title>
 </head>
 <body>
    <f:view>
        <h:outputText value="#{user.name}"/> 您好！
        <h3>欢迎使用 JavaServer Faces！</h3>
    </f:view>
 </body>
 </html>

7. 直接访问 http://localhost:8080/jsfTest/index.faces

猜你喜欢