当前位置：首页 > news >正文

java web mvc-05-JSF JavaServer Faces 入门例子

news 2025/7/15 1:00:07

拓展阅读

Spring Web MVC-00-重学 mvc

mvc-01-Model-View-Controller 概览

web mvc-03-JFinal

web mvc-04-Apache Wicket

web mvc-05-JSF JavaServer Faces

web mvc-06-play framework intro

web mvc-07-Vaadin

web mvc-08-Grails

开源

The jdbc pool for java.(java 手写 jdbc 数据库连接池实现)

The simple mybatis.（手写简易版 mybatis）

JSF 的入门例子

以下是一个简单的JavaServer Faces（JSF）入门例子，演示如何创建一个简单的Web应用程序。在这个例子中，我们将创建一个简单的登录页面，用户输入用户名和密码，点击登录按钮后显示欢迎消息。

创建一个新的Web应用项目：
在你的IDE（例如Eclipse、IntelliJ等）中创建一个新的Web应用项目。
添加JSF支持：
确保项目中添加了JSF的支持库。你可以在WEB-INF/lib目录下添加javax.faces.jar等JSF相关的JAR文件。

创建JSF页面：
在WebContent目录下创建一个名为login.xhtml的JSF页面。

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"xmlns:h="http://java.sun.com/jsf/html"xmlns:f="http://java.sun.com/jsf/core"><h:head><title>JSF Login Example</title>
</h:head>
<h:body><h:form><h:outputLabel value="Username:"/><h:inputText value="#{userBean.username}" required="true"/><h:outputLabel value="Password:"/><h:inputSecret value="#{userBean.password}" required="true"/><h:commandButton value="Login" action="#{userBean.login}"/></h:form>
</h:body>
</html>

创建Managed Bean：
创建一个名为UserBean的Managed Bean，用于处理用户输入和登录逻辑。

import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;@ManagedBean
@SessionScoped
public class UserBean {private String username;private String password;public String getUsername() {return username;}public void setUsername(String username) {this.username = username;}public String getPassword() {return password;}public void setPassword(String password) {this.password = password;}public String login() {// Simple login logic (for demonstration purposes)if ("admin".equals(username) && "password".equals(password)) {return "welcome"; // Navigation case to welcome.xhtml} else {return "error"; // Navigation case to error.xhtml}}
}

创建欢迎和错误页面：
创建welcome.xhtml和error.xhtml页面，用于显示登录成功和失败的消息。

<!-- welcome.xhtml -->
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"xmlns:h="http://java.sun.com/jsf/html"><h:head><title>Welcome</title>
</h:head>
<h:body><h:outputText value="Welcome, #{userBean.username}!"/>
</h:body>
</html>

<!-- error.xhtml -->
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"xmlns:h="http://java.sun.com/jsf/html"><h:head><title>Error</title>
</h:head>
<h:body><h:outputText value="Login failed. Please check your credentials."/>
</h:body>
</html>

配置导航规则：
在faces-config.xml中配置导航规则，以便在登录成功或失败时导航到相应的页面。

<navigation-rule><from-view-id>/login.xhtml</from-view-id><navigation-case><from-outcome>welcome</from-outcome><to-view-id>/welcome.xhtml</to-view-id></navigation-case><navigation-case><from-outcome>error</from-outcome><to-view-id>/error.xhtml</to-view-id></navigation-case>
</navigation-rule>