创建Struts2登录程序

通过硬编码的形式在Action中验证的(用户名: Admin 密码: Admin)

 

程序是如何工作的 ：

1.      显示登录页面等待输入

2.      用户输入用户名和密码后点击"Login"按钮

3.      在Action类中用户校验得到了执行,如果用户在name/password字段输入Admin/Admin,那么将会显示成功页面.否则页面显示错误信息.

开发本程序的步骤 :

这是些简单的创建登录页面的步骤 :

 

1. 创建登录页面

程序的用户界面由登录表单(login.jsp)和成功消息页面(loginsuccess.jsp)组成. 
login.jsp用来向用户显示登录页面.在我们的程序中它存放在"webapps\Struts2tutorial\pages\",这就是login.jsp的代码 :

 1 <%@ taglib prefix="s" uri="/struts-tags" %>  
 2 <html>  
 3 <head>  
 4 <title>Struts 2 Login Application!</title>  
 5   
 6 <link href="<s:url value="/css/main.css"/>" rel="stylesheet" type="text/css"/>  
 7   
 8 </head>  
 9 <body>  
10 <s:form action="doLogin" method="POST">  
11 <tr>  
12 <td colspan="2">  
13 Login  
14 </td>  
15   
16 </tr>  
17   
18   <tr>  
19    <td colspan="2">  
20          <s:actionerror />  
21          <s:fielderror />  
22    </td>  
23   </tr>  
24   
25 <s:textfield name="username" label="Login name"/>  
26 <s:password name="password" label="Password"/>  
27 <s:submit value="Login" align="center"/>  
28   
29 </s:form>  
30   
31 </body>  
32   
33 </html>

代码 <s:actionerror />
<s:fielderror />

用来显示Action和字段校验的错误

 

代码 <s:form action="doLogin" method="POST">为程序生成了HTML表单

 

代码 <s:textfield name="username" label="Login name"/>
<s:password name="password" label="Password"/>

生成了Login Name和Password字段.

 

提交按钮由代码<s:submit value="Login" align="center"/>生成

 

当程序执行时产生了如下的HTML代码 :

 1 <html>  
 2     <head>  
 3         <title>Struts 2 Login Application!</title>  
 4         <link href="/Struts2tutorial/css/main.css" rel="stylesheet"  
 5           type="text/css"/>  
 6             
 7     </head>  
 8     <body>  
 9 <form id="doLogin" name="doLogin" onsubmit="return true;"   
10 action="/Struts2tutorial/roseindia/doLogin.action" method="POST">  
11 <table class="wwFormTable">  
12               
13  <tr>  
14        <td colspan="2">  
15            Login  
16        </td>  
17    </tr>  
18    <tr>  
19     <td class="tdLabel"><label for="doLogin_username" class="label">  
20      Login name:</label>  
21     </td>  
22     <td><input type="text" name="username" value="" id="doLogin_username"/>  
23    </td>  
24   </tr>  
25  <tr>  
26     <td class="tdLabel"><label for="doLogin_password" class="label">  
27     Password:</label></td>  
28     <td><input type="password" name="password" id="doLogin_password"/>  
29 </td>  
30 </tr>  
31  <tr>  
32     <td colspan="2"><div align="center"><input type="submit"   
33      id="doLogin_0" value="Login"/>  
34 </div></td>  
35 </tr>  
36 </table></form>  
37     </body>  
38 </html>

通过观察上面生成的HTML代码,你会发现Struts2自动生成HTML元素的form, html table, label.这是Struts2与Struts1相比的另一个杰出的特性.

 

loginsuccess.jsp页面显示的是当用户验证成功后的登录成功信息.这就是loginsuccess.jsp文件的代码 :

<html>   
<head>  
<title>Login Success</title>  
</head>  
<body>  
<p align="center"><font color="#000080" size="5">Login Successful</font></p>  
</body>  
</html>

2.创建Action类

现在让我们创建Action类来处理登录请求.在Struts2中不一定非要实现Action接口,任何含有execute()方法的POJO都可以当作Action使用.Struts2提供了一个基础的ActionSupport类来实现常用的接口.在我们的Action类中(Login.java)我们实现了ActionSupport接口.我们的"Login.java"存放在webapps\Struts2tutorial\WEB-INF\src\java\net\roseindia" 这就是Login.java这个Action类的代码 :

 1 package net.roseindia;  
 2 import com.opensymphony.xwork2.ActionSupport;  
 3 import java.util.Date;  
 4   
 5   
 6 /** 
 7  * <p> Validate a user login. </p> 
 8  */  
 9 public  class Login  extends ActionSupport {  
10   
11   
12     public String execute() throws Exception {  
13         System.out.println("Validating login");  
14     if(!getUsername().equals("Admin") || !getPassword().equals("Admin")){  
15             addActionError("Invalid user name or password! Please try again!");  
16             return ERROR;  
17     }else{  
18       return SUCCESS;  
19     }  
20   }  
21   
22   
23     // ---- Username property ----  
24   
25     /** 
26      * <p>Field to store User username.</p> 
27      * <p/> 
28      */  
29     private String username = null;  
30   
31   
32     /** 
33      * <p>Provide User username.</p> 
34      * 
35      * @return Returns the User username. 
36      */  
37     public String getUsername() {  
38         return username;  
39     }  
40   
41     /** 
42      * <p>Store new User username</p> 
43      * 
44      * @param value The username to set. 
45      */  
46     public void setUsername(String value) {  
47         username = value;  
48     }  
49   
50     // ---- Username property ----  
51   
52     /** 
53      * <p>Field to store User password.</p> 
54      * <p/> 
55      */  
56     private String password = null;  
57   
58   
59     /** 
60      * <p>Provide User password.</p> 
61      * 
62      * @return Returns the User password. 
63      */  
64     public String getPassword() {  
65         return password;  
66     }  
67   
68     /** 
69      * <p>Store new User password</p> 
70      * 
71      * @param value The password to set. 
72      */  
73     public void setPassword(String value) {  
74         password = value;  
75     }  
76   
77 }

3.  配置Action映射(在struts.xml文件中)

现在我们将要在struts.xml中创建Action映射.这就是添加到struts.xml中的代码 :

<action name="showLogin">  
<result>/pages/login.jsp</result>  
</action>  
  
<action name="doLogin" class="net.roseindia.Login">  
<result name="input">/pages/login.jsp</result>  
<result name="error">/pages/login.jsp</result>  
<result>/pages/loginsuccess.jsp</result>  
</action>

在上面的映射中,Action "showLogin"用来显示登录页面,"doLogin"则校验了用户使用的Action类(Login.java).

4.  CSS文件(main.css)

这个css文件用来增强login表单的显示效果.main.css文件存放在"\webapps\Struts2tutorial\css" directory.
这就是main.css:的代码 :

@CHARSET "UTF-8";  
  
body {  
font: 12px verdana, arial, helvetica, sans-serif;  
background-color:#FFFFFF;  
}   
  
table.wwFormTable {  
font: 12px verdana, arial, helvetica, sans-serif;  
border-width: 1px;  
border-color: #030;  
border-style: solid;  
color: #242;  
background-color: #ada;  
width: 30%;  
margin-left:35%;  
margin-right:35%;  
margin-top:15%;  
}   
  
table.wwFormTable th {  
}  
  
table.wwFormTable tr td {  
background-color: #dfd;  
margin: 5px;  
padding: 5px;  
}  
  
.tdLabel {  
/*  
border-width: 1px;  
border-color: #afa;  
border-style: solid;  
*/  
font-weight: bold;  
align: top;  
}   
  
.label {  
}   
  
.errorMessage {  
color: red;  
font-size: 0.8em;  
}   
  
#headerDiv {  
border-style: solid;  
border-width: 1px 1px 0px;  
border-color: black;  
padding: 5px;  
background-color: #7a7;  
/* height: 22px; */  
height: 1.8em;  
/* margin-bottom: 12px; */  
}  
  
#buttonBar {  
border-width: 0px 1px 1px;  
border-style: solid;  
border-color: black;  
color: white;  
margin-bottom: 12px;  
background-color: #7a7;  
height: 1.6em;  
padding: 5px;  
}  
  
#appName {  
color: white;  
font-size: 1.8em;  
}  
  
#pageTitle {  
font-size: 1.4em;  
color: #dfd;  
clear: none;  
}  
  
#appName, #pageTitle {  
float: right;  
}  
  
#menuContainer {  
float: left;  
}  
  
#brandingContainer {  
float: right:  
text-align: right;  
}

 

 

 posted on 2012-05-22 17:23  蔡傑儒  阅读(400)  评论(1)  编辑  收藏  举报