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

发布时间:2024年01月24日

拓展阅读

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应用程序。在这个例子中,我们将创建一个简单的登录页面,用户输入用户名和密码,点击登录按钮后显示欢迎消息。

  1. 创建一个新的Web应用项目:
    在你的IDE(例如Eclipse、IntelliJ等)中创建一个新的Web应用项目。

  2. 添加JSF支持:
    确保项目中添加了JSF的支持库。你可以在WEB-INF/lib目录下添加javax.faces.jar等JSF相关的JAR文件。

  3. 创建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>
    
  4. 创建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
            }
        }
    }
    
  5. 创建欢迎和错误页面:
    创建welcome.xhtmlerror.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>
    
  6. 配置导航规则:
    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>
    
  7. 运行应用程序:
    部署你的应用程序到Web服务器(如Tomcat)并访问http://localhost:8080/yourapp/login.xhtml

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

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

文章来源:https://blog.csdn.net/ryo1060732496/article/details/135798087
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。