在eclipse中基于JSP的用户注册登录界面
1、开发工具和开发环境
开发工具： MyEclipse10，JDK1.6.0_13(32位)，Tomcat7.0（32位），mysql5.7.13
开发环境：WIN10
2、Demo_JSP实现功能
用户登录、用户注册、退出登录。
3、Demo_JSP使用技术
本实例使用了JSP、JDBC来实现用户登录、用户注册和退出登录功能。系统架构图如图一所示：
图一：Demo_JSP系统架构图
下面请看图二（Demo_JSP中JSP文件间逻辑关系图）：
图二：Demo_JSP中JSP文件间逻辑关系图
4、具体实现
（1）在MyEclipse中新建一个Web project项目，并命名为Demo_JSP；
（2）向Demo_JSP项目中导入mysql-connector-java-5.1.6-bin.jar，这个包是实现Java连接数据库功能的包（不会导入包的同学，可以百度哟）；
附：mysql-connector-java-5.1.6-bin.jar百度云下载链接：http://pan.baidu.com/s/1i5psdDF 密码：meyg
（3）在Demo_JSP项目中新建以下JSP文件：
1）login.jsp，用户登录的首页界面，代码如下：
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<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>
<form name="form1" action="login_action.jsp" method="post">
<table width="200" border="1">
<tr>
<td colspan="2">登录窗口</td>
</tr>
<tr>
<td>用户名</td>
<td><input type="text" name="username" size="10"></td>
</tr>
<tr>
<td>密码</td>
<td><input type="password" name="password" size="10"></td>
</tr>
<tr>
<td colspan="2"><input type="submit" name="submit" value="登录"> <a
href="register.jsp">注册新用户</a></td>
</tr>
</table>
</form>
</body>
</html>
2）login_action.jsp，接收login.jsp页面中用户输入的用户名和密码，通过JDBC实现登录认证，具体代码如下：
<%@ page language="java" import="java.util.*,java.sql.*" pageEncoding="UTF-8"%>
<%@ include file="inc.jsp"%>
<%
//get parameters
String username = request.getParameter("username");
String password = request.getParameter("password");
//check null
if (username == null || password == null) {
response.sendRedirect("login.jsp");
}
//validate
boolean isValid = false;
String sql = "select * from userInfo where username='"+username+"' and password='"+password+"'";
try {
Class.forName(drv).newInstance();
Connection conn = DriverManager.getConnection(url, usr, pwd);
Statement stm = conn.createStatement();
ResultSet rs = stm.executeQuery(sql);
if(rs.next())isValid = true;
rs.close();
stm.close();
conn.close();
} catch (Exception e) {
e.printStackTrace();
out.println(e);
} finally {
}
if (isValid) {
session.setAttribute("username", username);
response.sendRedirect("welcome.jsp");
} else {
response.sendRedirect("login.jsp");
}
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>My JSP 'login_action.jsp' starting page</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>
</body>
</html>
3）inc.jsp，存放数据库连接的地址，具体代码如下：
<%@ page language="java" import="java.util.*,java.sql.*" pageEncoding="UTF-8"%>
<%
String drv = "com.mysql.jdbc.Driver";
String url = "jdbc:mysql://localhost:3306/library_system";
String usr = "root";
String pwd = "root";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>My JSP 'inc.jsp' starting page</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>
This is my JSP page. <br>
</body>
</html>
4）welcome.jsp，用户登录成功后的主界面，具体代码如下：
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>My JSP 'welcome.jsp' starting page</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>
<table width="100%">
<tr>
<td><img src="images/picture_01.png"></td>
<td><img src="images/picture_03.jpg" width="600" height="120"></td>
</tr>
<tr>
<td colspan="2">
<hr>
</td>
</tr>
<tr>
<td>
<table>
<tr>
<td><a href="welcome.jsp">Main</a></td>
</tr>
<tr>
<td><a href="menu1.jsp">Menu1</a></td>
</tr>
<tr>
<td><a href="menu2.jsp">Menu2</a></td>
</tr>
<tr>
<td><a href="menu3.jsp">Menu3</a></td>
</tr>
<tr>
<td><a href="menu4.jsp">Menu4</a></td>
</tr>
<tr>
<td><a href="menu5.jsp">Menu5</a></td>
</tr>
<tr>
<td><a href="menu6.jsp">Menu6</a></td>
</tr>
<tr>
<td><a href="menu7.jsp">Menu7</a></td>
</tr>
<tr>
<td><a href="menu8.jsp">Menu8</a></td>
</tr>
</table>
</td>
<td>
<form name="form1" action="logout.jsp" method="post">
<table width="200" border="1">
<tr>
<td colspan="2">登录成功</td>
</tr>
<tr>
<td>欢迎你，</td>
<td><%=(String) session.getAttribute("username")%></td>
</tr>
<tr>
<td colspan="2"><input type="submit" name="submit" value="退出"></td>
</tr>
</table>
</form>
</td>
</tr>
</table>
</body>
</html>
5）loginout.jsp，用户退出登录，返回登录主界面，具体代码如下：
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
session.removeAttribute("username");
response.sendRedirect("login.jsp");
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>My JSP 'logout.jsp' starting page</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>
</body>
</html>
6）register.jsp，实现用户注册界面，具体代码如下：
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>My JSP 'register.jsp' starting page</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>
<form name="form1" action="register_action.jsp" method="post">
<table width="200" border="1">
<tr>
<td colspan="2">注册窗口</td>
</tr>
<tr>
<td>用户名</td>
<td><input type="text" name="username" size="10"></td>
</tr>
<tr>
<td>密码</td>
<td><input type="password" name="password1" size="10"></td>
</tr>
<tr>
<td>确认密码</td>
<td><input type="password" name="password2" size="10"></td>
</tr>
<tr>
<td>Email</td>
<td><input type="text" name="email" size="10"></td>
</tr>
<tr>
<td colspan="2"><input type="submit" name="submit" value="登录"> <a
href="login.jsp">返回</a></td>
</tr>
</table>
</form>
</body>
</html>
7）register_action.jsp，通过JDBC实现注册，并把数据写入数据库，具体代码如下：
<%@ include file="inc.jsp"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<%
//get parameters
String username = request.getParameter("username");
String password1 = request.getParameter("password1");
String password2 = request.getParameter("password2");
String email = request.getParameter("email");
//check null
if (username == null || password1 == null || password2 == null || !password1.equals(password2)) {
response.sendRedirect("register.jsp");
}
//validate
boolean isValid = false;
String sql = "select * from userInfo where username='"+username+"'";
try {
Class.forName(drv).newInstance();
Connection conn = DriverManager.getConnection(url, usr, pwd);
Statement stm = conn.createStatement();
ResultSet rs = stm.executeQuery(sql);
if(!rs.next()) {
sql = "insert into userInfo(username,password,mail) values('"+username+"','"+password1+"','"+email+"')";
stm.execute(sql);
isValid = true;
}
rs.close();
stm.close();
conn.close();
} catch (Exception e) {
e.printStackTrace();
out.println(e);
}
if (isValid) {
response.sendRedirect("login.jsp");
} else {
response.sendRedirect("register.jsp");
}
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>My JSP 'register_action.jsp' starting page</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>
</body>
</html>
5、运行结果展示
（1）在浏览器中输入http://localhost:8080/Demo_JSP/login.jsp，将出现如下图三所示：
图三：登录界面
（2）点击注册新用户，将会出现如下图四所示：
图四：注册界面
（3）注册成功后，会自动返回到登录界面，然后输入用户名和密码，点击登录将出现如下图五所示：
图五：登录后的welcome.jsp界面
数据库sql源码
/* MySQL Backup Source Server Version: 5.7.13 Source Database: library_system Date: 2016/7/24 11:59:30 */ SET FOREIGN_KEY_CHECKS=0; -- ---------------------------- -- Table structure for `good` -- ---------------------------- DROP TABLE IF EXISTS `good`; CREATE TABLE `good` ( `sid` int(11) NOT NULL AUTO_INCREMENT, `sname` varchar(50) DEFAULT NULL, `sprice` float DEFAULT NULL, PRIMARY KEY (`sid`) ) ENGINE=InnoDB AUTO_INCREMENT=11 DEFAULT CHARSET=utf8; -- ---------------------------- -- Table structure for `userinfo` -- ---------------------------- DROP TABLE IF EXISTS `userinfo`; CREATE TABLE `userinfo` ( `userId` int(11) NOT NULL AUTO_INCREMENT, `username` varchar(50) DEFAULT NULL, `password` varchar(50) DEFAULT NULL, `realname` varchar(50) DEFAULT NULL, `telephone` varchar(50) DEFAULT NULL, `address` varchar(50) DEFAULT NULL, `mail` varchar(50) DEFAULT NULL, PRIMARY KEY (`userId`) ) ENGINE=InnoDB AUTO_INCREMENT=10 DEFAULT CHARSET=utf8; -- ---------------------------- -- Records -- ---------------------------- INSERT INTO `good` VALUES ('1','红楼梦','34.88'), ('2','西游记','36.7'), ('3','三国演义','65.5'), ('4','水浒传','55.8'), ('5','平凡的世界','60.8'), ('6','数据库原理','35.5'), ('7','软件工程导论','45.5'), ('8','编译原理','25.88'), ('9','C语言','50'), ('10','Java基础','40.5'); INSERT INTO `userinfo` VALUES ('1','舞动的心','123456','柳真','15927175720','xxx大学','780862850@qq.com'), ('2','舞动的心','123456',NULL,NULL,NULL,NULL), ('3','2016','123456',NULL,NULL,NULL,NULL), ('4','舞动的心','123456',NULL,NULL,NULL,NULL), ('5','123','123','123','123','123','123'), ('6','123','123','123','123','123','123'), ('7','','123','','123','','123'), ('8','001','001',NULL,NULL,NULL,'001'), ('9','002','002',NULL,NULL,NULL,'002');
附：Demo_JSP项目实例源码百度云下载链接：http://pan.baidu.com/s/1mifI8nI 密码：j3wp; 本实例所使用数据库建表sql语句文件下载链接：http://pan.baidu.com/s/1eS0n9aM 密码：7ttd
愿路途漫长，以后莫失莫忘。 愿你不骄不躁，安稳顺心。
作者：菜鸟-传奇
本文版权归作者和博客园共有，重在学习交流，不以任何盈利为目的，欢迎转载。
敲敲小黑板：《刑法》第二百八十五条 【非法侵入计算机信息系统罪；非法获取计算机信息系统数据、非法控制计算机信息系统罪】违反国家规定，侵入国家事务、国防建设、尖端科学技术领域的计算机信息系统的，处三年以下有期徒刑或者拘役。违反国家规定，侵入前款规定以外的计算机信息系统或者采用其他技术手段，获取该计算机信息系统中存储、处理或者传输的数据，或者对该计算机信息系统实施非法控制，情节严重的，处三年以下有期徒刑或者拘役，并处或者单处罚金；情节特别严重的，处三年以上七年以下有期徒刑，并处罚金。
