原创作者: 饕尽天下   阅读:7644次   评论:4条   更新时间:2011-06-01    

本章我们将会开发基于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的代码 :

<%@ taglib prefix="s" uri="/struts-tags" %>
<html>
<head>
<title>Struts 2 Login Application!</title>

<link href="<s:url value="/css/main.css"/>" rel="stylesheet" type="text/css"/>

</head>
<body>
<s:form action="doLogin" method="POST">
<tr>
<td colspan="2">
Login
</td>

</tr>

  <tr>
   <td colspan="2">
         <s:actionerror />
         <s:fielderror />
   </td>
  </tr>

<s:textfield name="username" label="Login name"/>
<s:password name="password" label="Password"/>
<s:submit value="Login" align="center"/>

</s:form>

</body>

</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 NamePassword字段.

 

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

 

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

<html>
    <head>
        <title>Struts 2 Login Application!</title>
	    <link href="/Struts2tutorial/css/main.css" rel="stylesheet"
          type="text/css"/>
		  
	</head>
    <body>
<form id="doLogin" name="doLogin" onsubmit="return true;" 
action="/Struts2tutorial/roseindia/doLogin.action" method="POST">
<table class="wwFormTable">
			
 <tr>
       <td colspan="2">
           Login
       </td>
   </tr>
   <tr>
    <td class="tdLabel"><label for="doLogin_username" class="label">
     Login name:</label>
    </td>
    <td><input type="text" name="username" value="" id="doLogin_username"/>
   </td>
  </tr>
 <tr>
    <td class="tdLabel"><label for="doLogin_password" class="label">
    Password:</label></td>
    <td><input type="password" name="password" id="doLogin_password"/>
</td>
</tr>
 <tr>
    <td colspan="2"><div align="center"><input type="submit" 
     id="doLogin_0" value="Login"/>
</div></td>
</tr>
</table></form>
    </body>
</html>

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

 

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类的代码 :

package net.roseindia;
import com.opensymphony.xwork2.ActionSupport;
import java.util.Date;


/**
 * <p> Validate a user login. </p>
 */
public  class Login  extends ActionSupport {


    public String execute() throws Exception {
        System.out.println("Validating login");
    if(!getUsername().equals("Admin") || !getPassword().equals("Admin")){
            addActionError("Invalid user name or password! Please try again!");
            return ERROR;
    }else{
      return SUCCESS;
    }
  }


    // ---- Username property ----

    /**
     * <p>Field to store User username.</p>
     * <p/>
     */
    private String username = null;


    /**
     * <p>Provide User username.</p>
     *
     * @return Returns the User username.
     */
    public String getUsername() {
        return username;
    }

    /**
     * <p>Store new User username</p>
     *
     * @param value The username to set.
     */
    public void setUsername(String value) {
        username = value;
    }

    // ---- Username property ----

    /**
     * <p>Field to store User password.</p>
     * <p/>
     */
    private String password = null;


    /**
     * <p>Provide User password.</p>
     *
     * @return Returns the User password.
     */
    public String getPassword() {
        return password;
    }

    /**
     * <p>Store new User password</p>
     *
     * @param value The password to set.
     */
    public void setPassword(String value) {
        password = value;
    }

}

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;
}

在下一章中我们将会学习如何在login程序中添加验证.

评论 共 4 条 请登录后发表评论
4 楼 陈文景 2010-08-07 15:24
3 楼 三尺之尚 2010-05-21 11:46
丁丁豆 写道
这个感觉没什么意思

对初学者很有用
2 楼 丁丁豆 2009-10-09 11:56
这个感觉没什么意思
1 楼 kalin001 2009-08-31 15:48
yeah 

发表评论

您还没有登录,请您登录后再发表评论

文章信息

Global site tag (gtag.js) - Google Analytics