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

拓展阅读

开源

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页面。

xml 复制代码

<!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，用于处理用户输入和登录逻辑。

java 复制代码

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页面，用于显示登录成功和失败的消息。

xml 复制代码

<!-- 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>

xml 复制代码

<!-- 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中配置导航规则，以便在登录成功或失败时导航到相应的页面。

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>

运行应用程序：

部署你的应用程序到Web服务器（如Tomcat）并访问http://localhost:8080/yourapp/login.xhtml。

这是一个简单的JSF入门例子，演示了如何创建一个基本的用户登录页面和相应的逻辑。

请注意，这只是一个简单的示例，实际应用程序中可能需要更复杂的安全和验证机制。