登录功能的实现

  首先讲一下这个登录界面可实现的功能:

1.基本界面有了;

2.具有容错性,如果什么都不输入,直接点确定,会提示错误;

3.连接了数据库,建了表,可以实现注册,以及登录;

4.能够正常登陆进去;

5.如果登录的账号密码不正确,会提示重新登录。

  下面讲讲具体怎么实现?

首先我们要理清思路:

1.登录界面输入用户的ID和口令;

2.然后点击确定按钮,我们先要在客户端对文本框中的东西进行验证;

3.如果格式正确,则提交到控制器进行验证,如果不存在这个用户或者密码不正确都会提示重新登录,验证正确的话,则进入登录成功的界面,否则进入登录失败的界面;

4.如果文本框的内容格式不正确,那么光标会自动停在出错的文本框里。

 

  那么第一步,我们首先创建数据库:

在数据库应用软件中创建我们需要的数据库,并且建一个我们需要用的表。

如下图所示:

 

  第二步,创建登录界面:

先用HTML的知识写出了基本显示,然后在提交表单之前,会先用javascript写的方法对表单元素进行验证,使其具有正确的格式;当格式正确时,才会把表单元素里的标签提交到下一个页面里。

代码如下:

<%@ page contentType="text/html; charset=gb2312"%>

<script language="JavaScript">
      function isValidate(form){
          //得到用户输入的用户名和密码
          userid=form.userid.value;
          userpass=form.userpass.value;
          
          //接下来先验证用户名
          //如果用户名的长度小于六
          if(userid.length<6){
              alert("用户名的长度小于六。");
              form.userid.focus();
              return false;
          }
          
          //如果用户名的长度大于8
          if(userid.length>8){
              alert("用户名的长度大于八。");
              form.userid.focus();
              return false;
          }
         
          //接下来验证口令
          //如果密码的长度小于六
          if(userpass.length<6){
              alert("密码的长度小于六。");
              form.userpass.focus();
              return false;
          }
          
          //如果密码的长度大于8
          if(userpass.length>8){
              alert("密码的长度大于八。");
              form.userpass.focus();
              return false;
          }
          
          //密码与用户名不能相等
          if(userpass==username){
              alert("密码与用户名不能相等");
              form.userpass.focus;
              return false;
          }
          
      }
</script>

<html>
<head>
<title>登录界面</title>
</head>
<body>
    <h2 align="center">登录界面</h2>
    <form name=form1 action="login" method="post" onsubmit="return isValidate(form1)">
        <table align="center">
            <tr>
                <td>用户ID:</td>
                <td><input type="text" name="userid" >6~8位</td>
            </tr>
            <tr>
                <td>口令:</td>
                <td><input type="password" name="userpass" >6~8位,且不能与用户ID相同</td>
            </tr>

            <tr>
                <td><input type="reset" value="重置"></td>
                <td><input type="submit" value="确定"></td>
                
            </tr>

        </table>
    </form>
    <table align="center">
        <tr>
            <td><input  type="button" value="点击注册用户" onclick="window.location.href='register.jsp'" /></td>
        </tr>
    </table>
</body>
</html>

 

  第三步:编写连接数据库,以及对表单元素的验证。

由于JSP主要用于显示,所以我又再写了一个servlet用于对输入的信息进行处理;

首先写一个方法,从数据库中查找登录界面中输入的用户名的密码,如果有,则返回正确的密码,

否则 ,返回null;

然后重写doget方法,对登录进行响应,如果输入的密码与从数据库中返回的密码相同,那么转到登录成功后的界面,如果登录失败,那么则提示用户重新登录。

具体代码如下:

package servlets;

import java.io.*;
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.ResultSet;
import java.sql.Statement;
import java.util.ArrayList;

import javax.servlet.*;
import javax.servlet.http.*;

import bean.*;

public class LoginServlet extends HttpServlet {
    //该方法用户验证用户名和密码
    public int check(String userid,String userpass)
    {
        String URL="jdbc:mysql://127.0.0.1:3306/bookstore";
        String NAME="root";
        String PASS="*********";
        String SQL="select userpass from userinfo where userid='"+userid+"'";
    
        try {
            //加载驱动
            Class.forName("com.mysql.jdbc.Driver");
            //连接对象
            Connection con=DriverManager.getConnection(URL, NAME, PASS);
            //语句对象
            Statement stmt=con.createStatement();
            ResultSet rs=stmt.executeQuery(SQL);
            
            //得到该用户名的密码
            String tmpPass="";
            if(rs.next())
            {
                tmpPass=rs.getString(1);
            
            }
            //关闭对象,释放资源
            rs.close();
            stmt.close();
            con.close();
            
            //判断密码是否正确
            if(tmpPass.equals(userpass))
            {
                return 1;
            }
            
        } catch (Exception e) {
            // TODO Auto-generated catch block
            e.printStackTrace();
        }
        return 0;
        
    }
    
    /* (non-Javadoc)
     * @see javax.servlet.http.HttpServlet#service(javax.servlet.http.HttpServletRequest, javax.servlet.http.HttpServletResponse)
     */
    @Override
    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        // TODO Auto-generated method stub
        //获取用户的用户名和口令
        request.setCharacterEncoding("utf-8");
        String userid=request.getParameter("userid");
        String userpass=request.getParameter("userpass");
        
        int result=check(userid,userpass);
        //要转向的文件
        String forward;
        
        //如果登录成功,就把用户名写入session中,并且转向success.jsp,
        //否则转向failure.jsp
        
        if(result==1){
            forward="manager.jsp";
            
        }
        else
            forward="login_failure.jsp";
        
        RequestDispatcher dispatcher=request.getRequestDispatcher(forward);
        
        //完成跳转
        dispatcher.forward(request,response);
        
    }

    
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        // TODO Auto-generated method stub
        doGet(request,response);
    }

}

 至此,登录这个功能也就算是实现了。

下面是结果截图:

输入的格式不正确时:

 

出错的情况下:

登录成功时:

 

posted @ 2017-02-21 14:28  Kefi123  阅读(16069)  评论(2编辑  收藏  举报