速动画教程系列第11集
下载:
http://oksonic.kc100.net/download/sonic011.rar
这一集将介绍jsf的基本使用
使用jsf + hibernate制作一个login实例
开发工具:Eclipse3.1、MyEclipse4.0.3、Tomcat、MySql
打开Eclipse
新建 web 工程,名称为login,j2ee版本为2.4
创建jsf框架
在工程目录上点右键-->MyEclipse-->Add JSF Capabilities
在弹出配置对话框时,使用默认的设置就可以了。
这时打开web.xml文件就可以看到以下的配置信息了
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://java.sun.com/xml/ns/j2ee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" version="2.4" xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee http://java.sun.com/xml/ns/j2ee/web-app_2_4.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>Faces Servlet</servlet-name>
<servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
<load-on-startup>0</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>Faces Servlet</servlet-name>
<url-pattern>*.faces</url-pattern>
</servlet-mapping>
</web-app>
现在创建两个Bean,一个用来处理用户信息的验证,一个是和页面中的数据进行绑定
UserValidator.java
public class UserValidator {
// 这是验证用户名和密码的过程
public String validator(String username, String password) {
if ((username == null) || (username.length() < 1))
return "failure";
if ((password == null) || (password.length() < 1))
return "failure";
if ((username.equals("test")) && (password.equals("test")))
return "success";
else
return "failure";
}
}
LoginBean.java
public class LoginBean {
private String username; //用户名称
private String password; //密码
private UserValidator uv; //用户验证的实例
public String getPassword() {
return password;
}
public void setPassword(String password) {
this.password = password;
}
public String getUsername() {
return username;
}
public void setUsername(String username) {
this.username = username;
}
public UserValidator getUv() {
return uv;
}
public void setUv(UserValidator uv) {
this.uv = uv;
}
// 用户登录过程
public String login() {
return uv.validator(username, password);
}
}
现在按下Ctrl + N 键,使用jsp的向导来配置这两个Bean
MyEclipse-->WEB-JSF-->Managed Bean
Project: login
选中:Open Config File in Editor
Name: userValidator 就是Bean中的一个,这里的name可以自己起一个,如将第一个字母改为小写userValidator
Class: com.jsf.UserValidator
Scope: request
点击完成生成配置内容如下:
<faces-config >
<managed-bean>
<managed-bean-name>userValidator</managed-bean-name>
<managed-bean-class>com.jsf.UserValidator</managed-bean-class>
<managed-bean-scope>request</managed-bean-scope>
</managed-bean>
</faces-config>
再次配置另一个Bean,不过这一回增加了一个属性
按下Ctrl + N 键,选择MyEclipse-->WEB-JSF-->Managed Bean
Project: login
选中:Open Config File in Editor
Name: loginBean
Class: com.jsf.LoginBean
Scope: request
点击add按钮
Name: uv 这里的内容为LoginBean中的uv属性,这个可是不能乱填的
Class: 这个不填
点下一步
Property Value: #{userValidator} 这里花括号中的内容为刚才配置的UserValidator的name属性,name属性的第一个字母使用的是小写
好,确定,完成
配置文件中新增了如下代码:
<managed-bean>
<managed-bean-name>loginBean</managed-bean-name>
<managed-bean-class>com.jsf.LoginBean</managed-bean-class>
<managed-bean-scope>request</managed-bean-scope>
<managed-property>
<property-name>uv</property-name>
<value>#{userValidator}</value>
</managed-property>
</managed-bean>
在这一个bean中,它的uv属性被指定要在运行时注入一个com.UserValidator的实例。
现在创建jsp文件
打开WEB-INF目录下的 faces-config.xml 文件(如果你已经关闭了)
使用工具栏中的工具创建四个页面index.jsp、login.jsp、ok.jsp、error.jsp
使用工具栏中的工具navigation创建页面的关系
在弹出对话框中的From Outcome中分别填入success、failure
新增的配置信息如下:
<navigation-rule>
<from-view-id>/login.jsp</from-view-id>
<navigation-case>
<from-outcome>success</from-outcome>
<to-view-id>/ok.jsp</to-view-id>
</navigation-case>
<navigation-case>
<from-outcome>failure</from-outcome>
<to-view-id>/error.jsp</to-view-id>
</navigation-case>
</navigation-rule>
<navigation-rule>
<from-view-id>/ok.jsp</from-view-id>
</navigation-rule>
<navigation-rule>
<from-view-id>/error.jsp</from-view-id>
</navigation-rule>
现在编写login.jsp中的代码如下:
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>
<%@ page language="java" pageEncoding="UTF-8"%>
<html>
<head>
<title>
Login
</title>
</head>
<body>
<f:view>
<h:form>
<h:panelGrid columns="3">
<h:outputLabel for="username" value="User Name:" />
<h:inputText id="username" value="#{loginBean.username}" required="true" />
<h:message for="username" />
<h:outputLabel for="password" value="Password:" />
<h:inputSecret id="password" value="#{loginBean.password}" required="true" />
<h:message for="password" /> 这里的password要和上一行的id="password"对应才可以返回错误消息
</h:panelGrid>
<h:panelGrid>
<h:panelGroup>
<h:commandButton value="Login" action="#{loginBean.login}" />
</h:panelGroup>
</h:panelGrid>
</h:form>
</f:view>
</body>
</html>
修改 index.jsp,代码如下:
<html>
<head>
<title>Index</title>
</head>
<body>
<a href="login.faces">Login</a>
</body>
</html>
修改 ok.jsp,代码如下:
<html>
<head>
<title>Login OK!!!</title>
</head>
<body>
Login Ok!!!<br>
</body>
</html>
修改 error.jsp,代码如下:
<html>
<head>
<title>Error!!!</title>
</head>
<body>
Error!!!<br>
</body>
</html>
好了,代码完成可以进行测试了
首先部署web程序到服务器,如果在这一段遇到错误的话请查看我以前发布的关于Eclipse+MyEclipse配置的录像
输入正确的用户名和密码 (test , test),提交后进入ok.jsp,输入错误的密码后进入error.jsp
JSF部份已经完成,现在添加Hibernate框架
在工程目录上点右键-->MyEclipse-->Add Hibernate Capabilities
在弹出的对话框中使用默认设置
下一步,使用默认设置
下一步,如图
点击 完成
在 hibernate 的配置图型介面中,点击New... 创建一个数据库连接(具体方法请看录像)
配置完成后,内容如下:
<?xml version='1.0' encoding='UTF-8'?>
<!DOCTYPE hibernate-configuration PUBLIC
"-//Hibernate/Hibernate Configuration DTD 3.0//EN"
"http://hibernate.sourceforge.net/hibernate-configuration-3.0.dtd">
<!-- Generated by MyEclipse Hibernate Tools. -->
<hibernate-configuration>
<session-factory>
<property name="myeclipse.connection.profile">conn_mysql</property>
<property name="connection.url">jdbc:mysql://localhost:3306/test</property>
<property name="connection.username">root</property>
<property name="connection.password">root</property>
<property name="connection.driver_class">com.mysql.jdbc.Driver</property>
<property name="dialect">org.hibernate.dialect.MySQLDialect</property>
</session-factory>
</hibernate-configuration>
在配置文件加入一行,增加一个属性,可以在状态栏中显示hibernate的查询语句
<property name="show_sql">true</property>
修改后的配置文件内容如下:
<hibernate-configuration>
<session-factory>
<property name="myeclipse.connection.profile">conn_mysql</property>
<property name="connection.url">jdbc:mysql://localhost:3306/test</property>
<property name="connection.username">root</property>
<property name="connection.password">root</property>
<property name="connection.driver_class">com.mysql.jdbc.Driver</property>
<property name="show_sql">true</property>
<property name="dialect">org.hibernate.dialect.MySQLDialect</property>
</session-factory>
</hibernate-configuration>
点击 Copy JDBC Driver and add to classpath 将jdbc文件拷贝到lib目录中
现在启动MySql,并创建一张新表,这里我已经创建完成了,并在其中添加了一个用户名为test密码也是test的用户
CREATE TABLE `user` (
`ID` int(11) NOT NULL auto_increment,
`USERNAME` varchar(50) NOT NULL default '',
`PASSWORD` varchar(50) NOT NULL default '',
PRIMARY KEY (`ID`)
) ENGINE=MyISAM DEFAULT CHARSET=latin1;
打开 MyEclipse 的数据浏览工具
选中user表,点右键-->Create Hibernate Mapping
回到MyEclipse状态中
打开 UserValidator.java 文件
修改为以下内容:
import java.util.List;
import org.hibernate.Query;
import org.hibernate.Session;
import org.hibernate.Transaction;
import com.Hibernate.SessionFactory;
public class UserValidator {
// 这是验证用户名和密码的过程
public String validator(String username, String password) {
if ((username == null) || (username.length() < 1))
return "failure";
if ((password == null) || (password.length() < 1))
return "failure";
// 创建连接
Session session = SessionFactory.currentSession();
// 创建事务
Transaction tx = session.beginTransaction();
// 创建对话
Query query = session
.createQuery("from User as u where u.username=? and u.password=?");
query.setString(0, username);
query.setString(1, password);
List list = query.list();
// 事务提交
tx.commit();
if (list.size()>0)
return "success";
else
return "failure";
}
}
现在完成了全部的代码,可以进行测试了,修改后代码将会读取数据库的信息进行验证