前台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" οnfοcus="if(this.value=='Your name')this.value='';"><br>密码： <input type="password" name="txtPassword" value="Your password" οnfοcus="if(this.value=='Your password')this.value='';"><br> <input type="submit" name="Submit" value="提交"> <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" οnfοcus="if(this.value=='Your name')this.value='';"><br>密码： <input type="password" name="txtPassword" value="Your password" οnfοcus="if(this.value=='Your password')this.value='';"><br> <input type="submit" name="Submit" value="提交" onClick="validateLogin();" > <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" οnfοcus="if(this.value=='Your name')this.value='';"><br>密码： <input type="password" name="txtPassword" value="Your password" size="20" maxlength="20" οnfοcus="if(this.value=='Your password')this.value='';"><br> .....
..... if ( sUserName == "" || sUserName == null || sUserName.length()>20 ) .... if ( sPasswd == "" || sPasswd == null || sPasswd.length()>20 ) ......
这样问题就彻底解决了.
