总体内容不算复杂,主要是利用jsp+servlet+mysql去实现web端的注册/登录/显示当前用户/退出功能
先看看效果图:
注册:
注册成功后登录:
登录成功后显示用户信息,同时也可以选择用户退出功能
好了,言归正传,实现这样一个简单模块主要是用到servlet技术去处理用户的注册登录等信息,当然我们可以在这基础上可以加入其它需要的东西比如加个验证码、忘记密码、ajax技术等,当然servlet是基本元素,这个是需要掌握的。可以通过下面几个步骤去总结一下,希望能给刚入门java web的同学起到抛砖引玉的作用:
1.理清思路(要设计一个什么东西),设计数据库,数据表:
1
2
3
4
5
6
7
8
9
|
CREATE
TABLE
tb_user (
id
int
(10) unsigned
NOT
NULL
AUTO_INCREMENT
PRIMARY
KEY
,
username
varchar
(50)
NOT
NULL
,
password
varchar
(50)
NOT
NULL
,
sex
varchar
(10)
NOT
NULL
,
tel
varchar
(50)
NOT
NULL
,
photo TINYBLOB
NOT
NULL
,
email
varchar
(100)
NOT
NULL
)
|
这里需要注意photo类型要使用TINYBLOB,而不是varchar否则会提示出错信息: Data too long for column 'photo' at row 1
2.设计4个包用于放置java文件:
com.lxy(用户实体信息)
com.lxy.dao(数据库操作文件)
com.lxy.servlet(servlet文件)
com.lxy.code(编码文件)
3.编写用户实体类user.java(package:com.lxy)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
|
public
class
User {
private
int
id;
// 标识
private
String username;
// 用户名
private
String password;
// 密码
private
String sex;
// 性别
private
String tel;
// 电话
private
String photo;
// 头像
private
String email;
// 电子邮箱
public
int
getId() {
return
id;
}
public
void
setId(
int
id) {
this
.id = id;
}
下面省略getXXX()和setXXX()方法,请自行编写
|
4.编写数据库连接ConnectDB(package:com.lxy.dao)同时导入mysql的jar包
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
|
public
static
Connection getConnection(){
Connection conn =
null
;
try
{
// 加载驱动
Class.forName(
"com.mysql.jdbc.Driver"
);
// 数据库连接url
String url =
"jdbc:mysql://localhost:3306/db_test1"
;
// 获取数据库连接
conn = DriverManager.getConnection(url,
"root"
,
"lixiyu"
);
}
catch
(Exception e) {
e.printStackTrace();
}
return
conn;
}
/**
* 关闭数据库连接
* @param conn Connection对象
*/
public
static
void
closeConnection(Connection conn){
// 判断conn是否为空
if
(conn !=
null
){
try
{
conn.close();
// 关闭数据库连接
}
catch
(SQLException e) {
e.printStackTrace();
}
}
}
|
编写用户操作类UserDao(com.lxy.dao):
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
|
public
void saveUser(
User
user
){
// 获取数据库连接
Connection
对象
Connection
conn = ConnectDB.getConnection();
// 插入用户注册信息的SQL语句
String sql =
"insert into tb_user(username,password,sex,tel,photo,email) values(?,?,?,?,?,?)"
;
try {
// 获取PreparedStatement对象
PreparedStatement ps = conn.prepareStatement(sql);
// 对SQL语句的占位符参数进行动态赋值
ps.setString(1,
user
.getUsername());
ps.setString(2,
user
.getPassword());
ps.setString(3,
user
.getSex());
ps.setString(4,
user
.getTel());
ps.setString(5,
user
.getPhoto());
ps.setString(6,
user
.getEmail());
// 执行更新操作
ps.executeUpdate();
// 释放此 PreparedStatement 对象的数据库和 JDBC 资源
ps.
close
();
} catch (Exception e) {
e.printStackTrace();
}finally{
// 关闭数据库连接
ConnectDB.closeConnection(conn);
}
}
/**
* 用户登录
* @param username 用户名
* @param
password
密码
* @
return
用户对象
*/
public
User
login(String username, String
password
){
User
user
=
null
;
// 获取数据库连接
Connection
对象
Connection
conn = ConnectDB.getConnection();
// 根据用户名及密码查询用户信息
String sql =
"select * from tb_user where username = ? and password = ?"
;
try {
// 获取PreparedStatement对象
PreparedStatement ps = conn.prepareStatement(sql);
// 对SQL语句的占位符参数进行动态赋值
ps.setString(1, username);
ps.setString(2,
password
);
// 执行查询获取结果集
ResultSet rs = ps.executeQuery();
// 判断结果集是否有效
if(rs.
next
()){
// 实例化一个用户对象
user
= new
User
();
// 对用户对象属性赋值
user
.setId(rs.getInt(
"id"
));
user
.setUsername(rs.getString(
"username"
));
user
.setPassword(rs.getString(
"password"
));
user
.setSex(rs.getString(
"sex"
));
user
.setTel(rs.getString(
"tel"
));
user
.setPhoto(rs.getString(
"photo"
));
user
.setEmail(rs.getString(
"email"
));
}
// 释放此 ResultSet 对象的数据库和 JDBC 资源
rs.
close
();
// 释放此 PreparedStatement 对象的数据库和 JDBC 资源
ps.
close
();
} catch (Exception e) {
e.printStackTrace();
}finally{
// 关闭数据库连接
ConnectDB.closeConnection(conn);
}
return
user
;
}
/**
* 判断用户名在数据库中是否存在
* @param username 用户名
* @
return
布尔值
*/
public
boolean userIsExist(String username){
// 获取数据库连接
Connection
对象
Connection
conn = ConnectDB.getConnection();
// 根据指定用户名查询用户信息
String sql =
"select * from tb_user where username = ?"
;
try {
// 获取PreparedStatement对象
PreparedStatement ps = conn.prepareStatement(sql);
// 对用户对象属性赋值
ps.setString(1, username);
// 执行查询获取结果集
ResultSet rs = ps.executeQuery();
// 判断结果集是否有效
if(!rs.
next
()){
// 如果无效则证明此用户名可用
return
true
;
}
// 释放此 ResultSet 对象的数据库和 JDBC 资源
rs.
close
();
// 释放此 PreparedStatement 对象的数据库和 JDBC 资源
ps.
close
();
} catch (SQLException e) {
e.printStackTrace();
}finally{
// 关闭数据库连接
ConnectDB.closeConnection(conn);
}
return
false
;
}
}
|
5.编写注册/登录/退出的jsp和servlet(篇幅太长,这里只给出注册的关键代码,案例源码我会在后面共享出来)
注册reg.jsp:
写个javascripe去做判断:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
|
<script type=
"text/javascript"
>
function
reg(form){
if
(form.username.value ==
""
){
alert(
"用户不能为空!"
);
return
false
;
}
if
(form.password.value ==
""
){
alert(
"密码不能为空!"
);
return
false
;
}
if
(form.repassword.value ==
""
){
alert(
"确认密码不能为空!"
);
return
false
;
}
if
(form.password.value != form.repassword.value){
alert(
"两次密码输入不一致!"
);
return
false
;
}
if
(form.tel.value ==
""
){
alert(
"联系电话不能为空!"
);
return
false
;
}
if
(form.email.value ==
""
){
alert(
"电子邮箱不能为空!"
);
return
false
;
}
}
function
change(){
var
photo = document.getElementById(
"photo"
);
var
photoImg = document.getElementById(
"photoImg"
);
photoImg.src = photo.value;
}
</script>
|
下面在jsp中设计你所以想要的表单的效果比如我的这个用个table去写:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
|
<
form
action
=
"RegServlet"
method
=
"post"
onsubmit
=
"return reg(this);"
>
<
table
align
=
"center"
width
=
"450"
border
=
"0"
>
<
tr
>
<
td
align
=
"right"
>用户名:</
td
>
<
td
>
<
input
type
=
"text"
name
=
"username"
>
</
td
>
</
tr
>
<
tr
>
<
td
align
=
"right"
>密 码:</
td
>
<
td
>
<
input
type
=
"password"
name
=
"password"
>
</
td
>
</
tr
>
<
tr
>
<
td
align
=
"right"
>确认密码:</
td
>
<
td
>
<
input
type
=
"password"
name
=
"repassword"
>
</
td
>
</
tr
>
<
tr
>
<
td
align
=
"right"
>性 别:</
td
>
<
td
>
<
input
type
=
"radio"
name
=
"sex"
value
=
"男"
checked
=
"checked"
>男
<
input
type
=
"radio"
name
=
"sex"
value
=
"女"
>女
</
td
>
</
tr
>
<
tr
>
<
td
align
=
"right"
>头 像:</
td
>
<
td
>
<
select
name
=
"photo"
id
=
"photo"
onchange
=
"change();"
>
<
option
value
=
"images/boy.png"
selected
=
"selected"
>头像boy</
option
>
<
option
value
=
"images/girl.png"
>头像girl</
option
>
</
select
>
<
img
id
=
"photoImg"
src
=
"images/boy.png"
>
</
td
>
</
tr
>
<
tr
>
<
td
align
=
"right"
>联系电话:</
td
>
<
td
>
<
input
type
=
"text"
name
=
"tel"
>
</
td
>
</
tr
>
<
tr
>
<
td
align
=
"right"
>电子邮箱:</
td
>
<
td
>
<
input
type
=
"text"
name
=
"email"
>
</
td
>
</
tr
>
<
tr
>
<
td
colspan
=
"2"
align
=
"center"
>
<
input
type
=
"submit"
value
=
"注 册"
>
<
input
type
=
"reset"
value
=
"重 置"
>
</
td
>
</
tr
>
</
table
>
</
form
>
|
写注册的RegServlet:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
|
public
class
RegServlet
extends
HttpServlet {
private
static
final
long
serialVersionUID = 5280356329609002908L;
public
void
doPost(HttpServletRequest request, HttpServletResponse response)
throws
ServletException, IOException {
// 获取用户名
String username = request.getParameter(
"username"
);
// 获取密码
String password = request.getParameter(
"password"
);
// 获取性别
String sex = request.getParameter(
"sex"
);
// 获取头像
String photo = request.getParameter(
"photo"
);
// 获取联系电话
String tel = request.getParameter(
"tel"
);
// 获取电子邮箱
String email = request.getParameter(
"email"
);
// 实例化UserDao对象
UserDao userDao =
new
UserDao();
if
(username !=
null
&& !username.isEmpty()){
if
(userDao.userIsExist(username)){
// 实例化一个User对象
User user =
new
User();
// 对用户对象中的属性赋值
user.setUsername(username);
user.setPassword(password);
user.setSex(sex);
user.setPhoto(photo);
user.setTel(tel);
user.setEmail(email);
// 保存用户注册信息
userDao.saveUser(user);
request.setAttribute(
"info"
,
"恭喜,注册成功!<br>"
);
}
else
{
request.setAttribute(
"info"
,
"错误:此用户名已存在!"
);
}
}
// 转发到message.jsp页面
request.getRequestDispatcher(
"message.jsp"
).forward(request, response);
}
}
|
在xml中声明及映射servlet对象:
1
2
3
4
5
6
7
8
9
10
|
<!-- 用户注册 -->
<
servlet
>
<
servlet-name
>RegServlet</
servlet-name
>
<
servlet-class
>com.lxy.servlet.RegServlet</
servlet-class
>
</
servlet
>
<!-- Servlet映射 -->
<
servlet-mapping
>
<
servlet-name
>RegServlet</
servlet-name
>
<
url-pattern
>/RegServlet</
url-pattern
>
</
servlet-mapping
>
|
登录那块步骤也是相似的,就不一一展开了。源码里面注释较多,看下学习下基本上能懂得。
本文转自lixiyu 51CTO博客,原文链接:http://blog.51cto.com/lixiyu/1354594,如需转载请自行联系原作者