毕业实习项目-7
用户模块-用户注销
思路
前台：top.jsp
- 设置注销超链接的href属性，点击访问后台
后台： UserServlet
- 清除session中的user
- 清除Cookie
- 跳转首页
实操
- 编辑top.jsp文件的相关代码
top.jsp文件相关代码：
...
<!--用户已登陆-->
<c:if test="${!empty user }">
<a href="" class="shopping">购物车</a>
<a href="">${
user.userName }</a>
<!--用户注销-->
<!--使用action向后台传一个参数-->
<a href="user?action=logout">注销</a>
<a href="register.jsp">注册</a>
<a href="">留言板</a>
</c:if>
...
- 编辑UserServlet文件的相关代码
UserServlet文件相关代码：
...
if("login".equals(action)){
//登陆
login(request,response); //login报红按CTRL+1,选第二个创建一个方法
}else if("logout".equals(action)){
//注销
logout(request,response); //logout报红按CTRL+1,创建一个方法
}else{
response.sendRedirect("index");
}
}
//注销功能
private void logout(HttpServletRequest request, HttpServletResponse response) throws IOException {
// TODO Auto-generated method stub
//清除session中的user
request.getSession().removeAttribute("user");
//清除Cookie,直接用空的cookie覆盖原来的cookie
Cookie cookie = new Cookie("user",null);
cookie.setMaxAge(0);
response.addCookie(cookie);
//跳转首页
response.sendRedirect("index.jsp");
}
...
用户模块-用户注册
需要的资源
链接: https://pan.baidu.com/s/1hv20O2mUggp_A4QQrPXp1w .
提取码：csb8
思路
1. 新建一个register.jsp注册页面（资源已有）;
2. 用户名输入框失焦事件：
前台：
- 给用户名输入框绑定失焦事件，进行非空判断，空则提醒，不空则使用Ajax实现不刷新页面发送请求到后台，再通过回调函数接受的后台数据判断result；
result == 1 用户名可用
result == 2 用户名不能为空（防止用户直接跨过注册界面）
result == 3 用户名已存在，不可用
后台：
- 接受参数
- 非空判断，空，响应2，不为空则调用service通过用户名查询用户对象user（登录已写过，代码可复用），再进行非空判断，若空则响应1，不为空则响应3
3. 注册功能
前台：register.jsp
- 给提交注册按钮绑定点击事件
- 接受参数
- 非空判断
空，用户提示 - 提交表单
后台：UserServlet
- 接受参数
- 非空判断空，跳转注册页面并提示用户
- 判断密码和确认密码是否一致，不一致，跳转注册页面并提示用户
- 后台需要再判断用户名的唯一性，不唯一，跳转注册页面并提示用户
- 调用service添加用户，返回受影响的行数row
row <= 0；失败，跳转注册页面并提示用户 - 成功，跳转登录页面
实操
- 将资源里的register.jsp文件复制粘贴到WebContent文件夹下；
- 将资源里的reg-result.jsp文件复制粘贴到WebContent文件夹下；
此文件是注册成功跳转界面，不需要更改任何内容 - 在register.jsp文件写相关代码，完成前台功能：
register.jsp文件更新代码：
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link type="text/css" rel="stylesheet" href="css/style.css" />
<script type="text/javascript" src="js/jquery-1.11.1.js"></script>
<script type="text/javascript" src="js/My97DatePicker/WdatePicker.js"></script>
<title>易买网 - 注册</title>
</head>
<body>
<!-- 头部 -->
<div id="header" class="wrap">
<jsp:include page="common/top.jsp" />
</div>
<div id="register" class="wrap">
<div class="shadow" style="margin: 20px auto;">
<em class="corner lb"></em>
<em class="corner rt"></em>
<div class="box">
<h1>欢迎注册易买网</h1>
<ul class="steps clearfix">
<li class="current"><em></em>填写注册信息</li>
<li class="last"><em></em>注册成功</li>
</ul>
<!-- action后跳转后台 -->
<form id="regForm" method="post" action="user">
<!-- 多传一个数据用来标示模块 -->
<input type="hidden" name="action" value="register"></input>
<table>
<tr>
<td class="field">用户名(*)：</td>
<td>
<input class="text" type="text" id="userName" name="userName"/>
<font id="userErrorInfo" color="red"></font>
</td>
</tr>
<tr>
<td class="field">登录密码(*)：</td>
<td>
<input class="text" type="password" id="password" name="password"/>
</td>
</tr>
<tr>
<td class="field">确认密码(*)：</td>
<td>
<input class="text" type="password" id="rePassWord" name="rePassWord"/>
</td>
</tr>
<tr>
<td class="field">性别(*)：</td>
<td>
<input type="radio" name="sex" value="男" checked="checked"/>男
<input type="radio" name="sex" value="女"/>女
</td>
</tr>
<tr>
<td class="field">出生日期：</td>
<td>
<input type="text" id="birthday" name="birthday" class="Wdate" onClick="WdatePicker()"/>
</td>
</tr>
<tr>
<td class="field">身份证号：</td>
<td>
<input class="text" type="text" id="dentityCode" name="dentityCode"/>
</td>
</tr>
<tr>
<td class="field">Email：</td>
<td>
<input class="text" type="text" id="email" name="email"/>
</td>
</tr>
<tr>
<td class="field">手机号码(*)：</td>
<td>
<input class="text" type="text" id="mobile" name="mobile" />
</td>
</tr>
<tr>
<td class="field">收获地址(*)：</td>
<td>
<input class="text" type="text" id="address" name="address" />
</td>
</tr>
<tr>
<td></td>
<td>
<label class="ui-green">
<input style="cursor: pointer;" type="button" id="regBtn" value="提交注册" />
</label>
</td>
</tr>
<tr>
<td> </td>
<td>
<!-- msg接受错误消息 -->
<font id="error" color="red">${
msg }</font>
</td>
</tr>
</table>
</form>
</div>
</div>
<div class="clear"></div>
</div>
<div id="footer">
<jsp:include page="common/footer.jsp" />
</div>
</body>
<script type="text/javascript">
//1.给用户名输入框绑定失焦事件
$("#userName").blur(function(){
//进行非空判断
var userName = $(this).val();
if(userName.trim() == ""){
//空则提醒
$("#userErrorInfo").html("不能为空！");
return;
}
//不空,使用Ajax实现不刷新页面发送请求到后台，再通过回调函数接受的后台数据判断result
$.ajax({
type: "POST",
url: "user",
data: "action=checkName&userName="+userName,
success: function(result){
if(result == 1){
//result == 1 用户名可用
$("#userErrorInfo").html("");
}else if(result == 2){
//result == 2 用户名不能为空
$("#userErrorInfo").html("不能为空！");
}else{
//result == 3 用户名已存在，不可用
$("#userErrorInfo").html("用户名已存在，不可用");
}
}
});
});
//给提交注册按钮绑定点击事件
$("#regBtn").click(function(){
//接受参数
var userName = $("#userName").val();
var password = $("#password").val();
var rePassWord = $("#rePassWord").val();
var mobile = $("#mobile").val();
var address = $("#address").val();
//非空判断，带*的数据必须填写否则提示
if(userName.trim() == ""){
//空则提醒
$("#error").html("用户名不能为空！");
return;
}
if(password.trim() == ""){
//空则提醒
$("#error").html("密码不能为空！");
return;
}
if(rePassWord != password){
//空则提醒
$("#error").html("密码不一致！");
return;
}
if(mobile.trim() == ""){
//空则提醒
$("#error").html("手机号码不能为空！");
return;
}
if(address.trim() == ""){
//空则提醒
$("#error").html("收获地址不能为空！");
return;
}
//提交表单
$("#regForm").submit();
});
</script>
</html>
- 在UserServlet.java文件写相关代码，完成后台功能：
UserServlet.java文件更新代码：
...
protected void service(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// TODO Auto-generated method stub
//设置服务器默认编码
request.setCharacterEncoding("utf8");
//接受参数；
String action = request.getParameter("action");
//用户模块不仅仅只有登陆这一小模块
//所以把不同小模块的方法分别封装
//此处增加一个功能能够判断用户行为进而进入不同的小模块；
//对应前台 <!-- 多传一个数据用来标示模块 -->
//<input type="hidden" name="action" value="login"></input> 这段代码
if("login".equals(action)){
//登陆
login(request,response); //login报红按CTRL+1,选第二个创建一个方法
}else if("logout".equals(action)){
//注销
logout(request,response); //logout报红按CTRL+1,创建一个方法
}else if("checkName".equals(action)){
//验证用户名是否可用
checkName(request,response); //checkName报红按CTRL+1,创建一个方法
}else if("register".equals(action)){
//注册
try {
register(request,response);
} catch (ParseException e) {
// TODO Auto-generated catch block
e.printStackTrace();
} //checkName报红按CTRL+1,创建一个方法
}else{
response.sendRedirect("index");
}
}
//注册
private void register(HttpServletRequest request, HttpServletResponse response) throws ParseException, ServletException, IOException {
// TODO Auto-generated method stub
//接受参数
String userName = request.getParameter("userName");
String password = request.getParameter("password");
String rePassWord = request.getParameter("rePassWord");
String sex = request.getParameter("sex");
String birthdayStr = request.getParameter("birthday");
Date birthday = null;
if(StringUtil.isNotEmpty(birthdayStr)){
//如果用户输入了生日则格式化一下生日参数
birthday = new SimpleDateFormat("yyyy-MM-dd").parse(birthdayStr);
}
String dentityCode = request.getParameter("dentityCode");
String email = request.getParameter("email");
String mobile = request.getParameter("mobile");
String address = request.getParameter("address");
//判断密码和确认密码是否一致
if(!password.equals(rePassWord)){
//不一致，跳转注册页面并提示用户
request.setAttribute("msg", "密码不一致!");
request.getRequestDispatcher("register.jsp").forward(request, response);
return;
}
//后台需要再判断用户名的唯一性
User user = userService.findUserByName(userName);
if(user != null){
//不唯一，跳转注册页面并提示用户
request.setAttribute("msg", "用户名已存在!");
request.getRequestDispatcher("register.jsp").forward(request, response);
return;
}
//把用户封装到对象里去
User u = new User(userName,password,sex,birthday,dentityCode,email,mobile,address);//报红需要去User.java文件里生成一下自动构造参数，注意不要勾选多了，只要这里面的参数
//调用service添加用户，返回受影响的行数row
int row = userService.addUser(u); //addUser报红生成一下方法
if(row <= 0){
//row <= 0；失败，跳转注册页面并提示用户
request.setAttribute("msg", "注册失败!");
request.getRequestDispatcher("register.jsp").forward(request, response);
return;
}
//成功，跳转注册成功页面
response.sendRedirect("reg-result.jsp");
}
//验证用户名是否可用
private void checkName(HttpServletRequest request, HttpServletResponse response) throws IOException {
// TODO Auto-generated method stub
//接受参数
String userName = request.getParameter("userName");
//非空判断
if(StringUtil.isEmpty(userName)){
//空，响应2
response.getWriter().write("2");
return;
}
//不为空，调用service通过用户名查询用户对象user（登录已写过，方法可复用）
User user = userService.findUserByName(userName);
//进行非空判断
if(user != null){
//不为空则响应3
response.getWriter().write("3");
return;
}
//若空则响应1
response.getWriter().write("1");
}
//注销功能
...
- 在UserServiceImpl.java文件写相关代码，完成添加用户的方法：
UserServiceImpl.java文件相关代码：
//添加用户
@Override
public int addUser(User u) {
// TODO Auto-generated method stub
int row = 0;
Connection conn = null;
//异常
try{
//数据库操作
//建立连接
conn = DBUtil.getConnection();
//编写sql语句
String sql = "insert into t_user (address,birthday,dentityCode,email,mobile,password,sex,status,trueName,userName) values (?,?,?,?,?,?,?,?,?,?)";
//new一个QueryRunner
QueryRunner qr = new QueryRunner();
//创建参数数组
Object[] params = {
u.getAddress(),u.getBrithday(),u.getDentityCode(),u.getEmail(),u.getMobile(),u.getPassword(),u.getSex(),u.getStatus(),u.getTrueName(),u.getUserName()};
//执行更新
row = qr.update(conn, sql ,params);
} catch (Exception e){
e.printStackTrace();
}finally{
//关闭连接
DBUtil.close(null, null, conn);
}
return row;
}
用户模块做到这就结束了，下一篇就要做详情模块了！贴出成功的图片：
reg-result.jsp提示成功界面：
数据库新增数据：
