jsp登陆页面和前后台验证并连接数据库

JSP登录系统实现
本文介绍了一个使用JSP实现的基本登录系统的前后端代码。前端页面收集用户输入的用户名和密码,而后端则进行验证,包括客户端和服务端的验证流程,并通过数据库查询验证用户身份。

前台login.html和后台verifylogin.jsp两个页面组成:
login.html内容:

<html>
   <head>
     <title>登录</title>

     <meta http-equiv="content-type" content="text/html; charset=UTF-8">
     <meta http-equiv="Content-Language" content="ch-cn">
   </head>

   <body>
   <!-- Form 用来提取用户填入并提交的信息-->
   <form method="post" name="frmLogin" action="verifylogin.jsp">
   <h1 align="center">用户登录</h1><br>
   <div align="center">用户名:
     <input type="text" name="txtUserName" value="Your name"
      onfocus="if(this.value=='Your name')this.value='';"><br>密码:
     <input type="password" name="txtPassword" value="Your password"
      onfocus="if(this.value=='Your password')this.value='';"><br>
     <input type="submit" name="Submit" value="提交"> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
     <input type="reset" name="Reset" value="重置"><br>
   </div></form></body>
</html>

verifylogin.jsp内容:
<%@ page language="java" contentType="text/html;charset=gb2312"
pageEncoding="UTF-8"%>

<%@ page import="java.sql.*"%>
<%@ page import="java.util.*"%>


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
   <title>登录</title>

   <meta http-equiv="pragma" content="no-cache">
   <meta http-equiv="cache-control" content="no-cache">
   <meta http-equiv="expires" content="0">
   <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
   <meta http-equiv="description" content="This is my page">
   <!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->

</head>

<body>
   <div align=center>
   <%
    //获取用户名
    String sUserName = request.getParameter ( "txtUserName" );
    //获取密码
    String sPasswd = request.getParameter ( "txtPassword" );

    //登记JDBC驱动程序
    Class.forName ( "org.gjt.mm.mysql.Driver" ).newInstance ( );
    //连接参数与Access不同
    String url = "jdbc:mysql://localhost/LearnJSP";
    //建立连接
    Connection connection = DriverManager.getConnection ( url, "root",
      "011124" );
    //SQL语句
    String sql = "select * from userinfo where username='" + sUserName
      + "' and userpwd = '" + sPasswd + "'";

    Statement stmt = connection.createStatement ( );
    ResultSet rs = stmt.executeQuery ( sql ); //返回查询结果

    //如果记录集非空,表明有匹配的用户名和密码,登陆成功
    if ( rs.next ( ) )
    {
     out.println ( "登录成功!" );
    } else
    //否则登录失败
    {
     out.println ( "用户名不存在或密码错误!" );
    }

    rs.close ( );
    stmt.close ( );
    connection.close ( );
   %>
</body>
</html>

下面为客户端添加代码验证功能:
<html>
   <head>
     <title>登录</title>

     <meta http-equiv="content-type" content="text/html; charset=UTF-8">
     <meta http-equiv="Content-Language" content="ch-cn">

   </head>
   <body>
<!-- Form 用来提取用户填入并提交的信息-->
<form method="post" name="frmLogin" action="verifylogin.jsp">
    <h1 align="center">用户登录</h1><br>
    <div align="center">用户名:
       <input type="text" name="txtUserName" value="Your name"
        onfocus="if(this.value=='Your name')this.value='';"><br>密码:
       <input type="password" name="txtPassword" value="Your password"
        onfocus="if(this.value=='Your password')this.value='';"><br>
       <input type="submit" name="Submit" value="提交" onClick="validateLogin();" >
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
       <input type="reset" name="Reset" value="重置"><br>
    </div>
</form>
<!-- javaScript 函数 validateLogin(),用来验证用户名和密码是否为空 -->
     <script language="javaScript">
      function validateLogin()
      {
       var sUserName = document.frmLogin.txtUserName.value;
       var sPassword = document.frmLogin.txtPassword.value;
       if( sUserName=="" )
       {
        alert("请输入用户名!");
        return false;
       }
       if( sPassword=="" )
       {
        alert("请输入密码!");
        return false;
       }
      }
     </script>
   </body>
</html>


为服务器端添加代码验证功能:
<%@ page language="java" contentType="text/html;charset=gb2312"
pageEncoding="UTF-8"%>

<%@ page import="java.sql.*"%>
<%@ page import="java.util.*"%>


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
   <title>登录</title>

   <meta http-equiv="pragma" content="no-cache">
   <meta http-equiv="cache-control" content="no-cache">
   <meta http-equiv="expires" content="0">
   <meta http-equiv="keywords" content="zieckey,jsp">
   <meta http-equiv="description" content="Test JSP using MySQL">

</head>
<body>
   <div align=center>
    <%
     //获取用户名
     String sUserName = request.getParameter ( "txtUserName" );
     if ( sUserName == "" || sUserName == null || sUserName.length()>20 )
     {
      try
      {
       response.sendRedirect ( "login.html" );
      } catch ( Exception e )
      {
      }
     }

     //获取密码
     String sPasswd = request.getParameter ( "txtPassword" );
     if ( sPasswd == "" || sPasswd == null || sPasswd.length()>20 )
     {
      try
      {
       response.sendRedirect ( "login.html" );
      } catch ( Exception e )
      {
      }
     }

     //登记JDBC驱动程序
     Class.forName ( "org.gjt.mm.mysql.Driver" ).newInstance ( );
     //连接参数与Access不同
     String url = "jdbc:mysql://localhost/LearnJSP";
     //建立连接
     Connection connection = DriverManager.getConnection ( url, "root",
       "011124" );
     //SQL语句
     String sql = "select * from userinfo where username='" + sUserName
       + "' and userpwd = '" + sPasswd + "'";

     Statement stmt = connection.createStatement ( );
     ResultSet rs = stmt.executeQuery ( sql ); //返回查询结果

     //如果记录集非空,表明有匹配的用户名和密码,登陆成功
     if ( rs.next ( ) )
     {
      //登录成功后将sUserName设置为session变量的UserName
      //这样在后面就可以通过 session.getAttribute("UserName") 来获取用户名,
      //同时这样还可以作为用户登录与否的判断依据
      session.setAttribute ( "UserName", sUserName );
      out.print (   "登录成功!" );
      out.print ( session.getAttribute ( "UserName" ) + " 欢迎您!" );
     } else
     //否则登录失败
     {
      out.println ( "用户名不存在或密码错误!" );
     }

     rs.close ( );
     stmt.close ( );
     connection.close ( );
    %>

</body>
</html>


数据库中所有表的字段长度的设计标准是应该是足够用,但不浪费存储空间.
我们可以发现,上面数据库中字段限制在20个字符以内,那么程序中也应该作一个限制,
否则可能给网站出现严重的问题.
将上面源码修改如下:
     .....
     <input type="text" name="txtUserName" value="Your name"
        size="20" maxlength="20"
        onfocus="if(this.value=='Your name')this.value='';"><br>密码:
       <input type="password" name="txtPassword" value="Your password"
        size="20" maxlength="20"
        onfocus="if(this.value=='Your password')this.value='';"><br>
     .....

     .....
     if ( sUserName == "" || sUserName == null || sUserName.length()>20 )
     ....
     if ( sPasswd == "" || sPasswd == null || sPasswd.length()>20 )
     ......


<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@ page import="java.sql.*" %> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>普通话水平测试报名系统</title> </head> <body> <center> <h1>普通话水平测试报名系统</h1> <hr> <br> <br> <% //接收用户提交的参数 String username=request.getParameter("uname"); String userpassword=request.getParameter("upassword"); String userjb=request.getParameter("userjb"); //设置一个变量保存登录状态,ture表示登录成功,false表示登录失败 boolean flag=true; %> <% String driverclass="com.mysql.jdbc.Driver"; String url="jdbc:mysql://localhost:3306/atao"; String uname="root"; String upass="958672"; Connection conn=null; PreparedStatement stmt=null; ResultSet rs=null; Class.forName(driverclass); conn=DriverManager.getConnection(url,uname,upass); if(userjb.equals("1")) {stmt=conn.prepareStatement("select * from users where user_id=? and userpass=? and role=?"); stmt.setString(1,username); stmt.setString(2,userpassword); stmt.setString(3,userjb); rs=stmt.executeQuery(); if(rs.next()) { flag=false; } if(flag){ %> <script type="text/javascript" language="javascript"> alert("密码错误或无权限登录,请重新登录"); window.document.location.href="dl-index.jsp"; </script> <% } else{ request.setCharacterEncoding("UTF-8"); session.setAttribute("uname",rs.getString(1)); session.setAttribute("upassword",rs.getString(2)); session.setAttribute("userjb",rs.getString(3)); response.sendRedirect("sgly/gg-index.jsp"); rs.close(); stmt.close(); conn.close(); } } if(userjb.equals("2")) {stmt=conn.prepareStatement("select * from xxwyb where xxwy_id=? and password=? and role=?"); stmt.setString(1,username); stmt.setString(2,userpassword); stmt.setString(3,userjb); rs=stmt.executeQuery(); if(rs.next()) {session.setAttribute("id",rs.getString(1)); session.setAttribute("pd",rs.getString(7)); flag=false; } if(flag){ %> <script type="text/javascript" language="javascript"> alert("密码错误或无权限登录,请重新登录"); window.document.location.href="dl-index.jsp"; </script> <% } else{ request.setCharacterEncoding("UTF-8"); session.setAttribute("uname",rs.getString(1)); session.setAttribute("upassword",rs.getString(2)); session.setAttribute("userjb",rs.getString(3)); response.sendRedirect("sxxwy/xx-ym.jsp"); rs.close(); stmt.close(); conn.close(); } } if(userjb.equals("0")){ %> <script type="text/javascript" language="javascript"> alert("您还没有选择用户类型"); window.document.location.href="dl-index.jsp"; </script> <% } %> </center> </body> </html>
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值