JSF学习应用简单实例

最新推荐文章于 2022-01-21 10:17:33 发布

longgangbai

最新推荐文章于 2022-01-21 10:17:33 发布

阅读量171

点赞数

文章标签： JSF 应用服务器 Bean JavaEE Servlet

本文链接：https://blog.csdn.net/longgangbai/article/details/83839077

版权

最近工作比较闲，开始学习JSF开发，在JSF项目中，首先客户端触发相关的事件，发送请求到服务端的执行JSF的控制器类FacesServlet中，通过这个类执行服务类相关的方法的，服务类相关的方法调用相关的模型信息，将结果给客户端。下面简介开发一个简单的JSF 实例过程如下：

1.创建一个Web项目：

导入JSF相关的类库如下：

项目结构如下：

2.在faces-config.xml配置信息如下：

<?xml version='1.0' encoding='UTF-8'?>
<faces-config xmlns="http://java.sun.com/xml/ns/javaee"
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-facesconfig_1_2.xsd"
    version="1.2">
    <!-- 
         国际化配置
        在<local-config>一定有一个<default-locale>，而<supported-locale>可以有好几个，这告诉JSF您的应用程式支援哪些语系。
     -->
     
       <!-- 
      <f:view>可以设定locale属性，直接指定所要使用的语系

	    加载国家化的方法
	    JSF会根据<f:loadBundle>的basename属性加上<f:view>的locale属性来决定要使用哪一个讯息资源档
	 -->
	<application>
      <locale-config>
        <default-locale>en_US</default-locale>
        <supported-locale>zh_CN</supported-locale>
      </locale-config>
      <message-bundle>
      	messages
      </message-bundle>
    </application>
    
    <!-- JSF 校验器的配置 -->
    <validator>
		<validator-id>com.easyway.jsf.email</validator-id>
		<validator-class>com.easyway.jsf.commons.EmailValidator</validator-class>
	</validator>
  
	<!-- 容器管理bean的配置 -->
	<managed-bean>
		<managed-bean-name>mathService</managed-bean-name>
		<managed-bean-class>com.easyway.jsf.service.MathService</managed-bean-class>
		<managed-bean-scope>request</managed-bean-scope>
	</managed-bean>
	
	<!-- 容器导航的规则 -->
	<navigation-rule>
		<from-view-id>/index.jsp</from-view-id>
		<navigation-case>
			<from-outcome>result</from-outcome>
			<to-view-id>./result.jsp</to-view-id>
		</navigation-case>
	</navigation-rule>
	
</faces-config>

3.服务类中各种信息如下：

package com.easyway.jsf.service;

/***
 * JSF后台的服务的
 * @author longgangbai
 *
 */
public class MathService {
	private int num0;
	private int num1;
	private int result;
	private String email;
	private String password;
	
	
	public int getNum0() {
		return num0;
	}
	public void setNum0(int num0) {
		this.num0 = num0;
	}
	public int getNum1() {
		return num1;
	}
	public void setNum1(int num1) {
		this.num1 = num1;
	}
	public int getResult() {
		return num0+num1;
	}
	public void setResult(int result) {
		this.result = result;
	}
	
	public String getEmail() {
		return email;
	}
	public void setEmail(String email) {
		this.email = email;
	}
	public String getPassword() {
		return password;
	}
	public void setPassword(String password) {
		this.password = password;
	}
	
	public int sum(){
		return num0+num1;
	}
	/**
	 * 直面执行的方法
	 * 
	 * @return
	 */
	public String resultSum(){
		result =sum();
	 return "result";
	}
	

	
}

4.在Web.xml配置如下：

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" version="2.5" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee   http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">
  <context-param>
    <param-name>javax.faces.CONFIG_FILES</param-name>
    <param-value>/WEB-INF/faces-config.xml</param-value>
  </context-param>
  <servlet>
    <servlet-name>FacesServlet</servlet-name>
    <servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
    <load-on-startup>0</load-on-startup>
  </servlet>
  <servlet-mapping>
    <servlet-name>FacesServlet</servlet-name>
    <url-pattern>*.faces</url-pattern>
  </servlet-mapping>
  <welcome-file-list>
    <welcome-file>index.jsp</welcome-file>
  </welcome-file-list>
</web-app>

页面如下：

index.jsp:

<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
<%@ taglib uri="/WEB-INF/taglib.tld" prefix="co" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
	<base href="<%=basePath%>">
	<title>My JSF 'MyJsp.jsp' starting page</title>
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->
</head>
<body>
	<f:view locale="en_US">
	<f:loadBundle basename="messages" var="msgs"/>
     <h:form>
			<h:panelGrid columns="3">
			  <h:outputLabel value="#{msgs.math_num0}"></h:outputLabel>
			  <h:inputText id="num0" value="#{mathService.num0}" ></h:inputText>
			  <h:message for="num0" ></h:message>
			
			  <h:outputLabel value="#{msgs.math_num1}"></h:outputLabel>
			  <h:inputText id="num1" value="#{mathService.num1}" ></h:inputText>
			  <h:message for="num1" ></h:message>
			  
			<!-- 校验器的使用 -->
			 <h:outputLabel value="电子邮件："></h:outputLabel>
			  <h:inputSecret id="email" value="#{mathService.email}" required="true">
				   <f:validator validatorId="com.easyway.jsf.email" />
				   <f:attribute name="mymsg" value="电子邮件长度必须大于5个字符"/>
				   <f:attribute name="emailpattern" value="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*" />
			  </h:inputSecret>
			  <h:message for="email" ></h:message>
			  
		    <!-- 自定义标签的校验器的使用 -->
		     <h:outputLabel value="用户账号"></h:outputLabel>
			<h:inputSecret id="password" value="#{mathService.password}" required="true">
			    <co:EmailValidator pattern=".+[0-9]+"/>
			 </h:inputSecret>
			 <h:message for="password" ></h:message>
			 
		    <h:commandButton value="#{msgs.math_result}" action="#{mathService.resultSum}"></h:commandButton>
			
			</h:panelGrid>      
     </h:form>
	</f:view>
</body>
</html>

result.jsp:

<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
	<base href="<%=basePath%>">
	<title>My JSF 'result.jsp' starting page</title>
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->
</head>
<body>
	<f:view>
		<h:outputText value="#{mathService.num0}"/>
		和
		<h:outputText value="#{mathService.num1}"/>
		结算结果：
		<h:outputText value="#{mathService.result}"/>
	</f:view>
</body>
</html>

运行：

http://localhost:8080/JSFDemo/index.faces