web day14 web版简单注册登陆案例
项目
功能：
> 注册
> 登录
-------------
JSP：
*login.jsp --> 登录表单
*regist.jsp --> 注册表单
*index.jsp --> 主页(只有登录成功才能看到)
Servlet：
*LoginServlet
*RegistServlet
*VerifyCodeServlet
*QuitServlet
Service：
*UserService --> 与用户相关的业务类
Dao：
*UserDao --> 与用户相关的数据类
Domain：
*User（对应数据库，还要对应所有表单）
> username
> password
> verifyCode
-------------
数据库设计
*users.xml
<users>
<user username="xxx" password="xxx"/>
<user username="xxx" password="xxx"/>
</users>
-------------
项目框架搭建
步骤：
1. 创建空项目
2. 导包：
*CommonUtils
*commons-beanutils.jar
*commons-logging.jar
*dom4j
3. 建包
*cn.itcast.user.domain
> User
*cn.itcast.user.dao
> UserDao
*cn.itcast.user.service
> UserService
*cn.itcast.user.web.servlet
> LoginServlet
> RegistServlet
4. jsp
*login.jsp
*regist.jsp
*index.jsp
5. 在F盘下创建一个users.xml文件！
* 添加根元素<users>
* 保证文件为utf-8编码！！！
-------------
注册
regist.jsp
> 第一步：完成regist.jsp的基本功能！
RegistServlet
> 封装表单数据，封装到User对象中。
> 调用service的regist()方法
*如果这个方法没有出问题，输出“注册成功”
*如果这个方法抛出了异常，把错误信息保存到request域，转发到regist.jsp(显示错误信息)
UserService#regist()
> 没有返回值，但注册失败抛出一个自定义的异常！可以在异常中添加异常信息！(自定义一个异常类)
> 校验用户名是否已被注册（通过用户名查询用户），如果已被注册，抛出异常，异常信息为“用户名已被注册！”
> 添加用户
UserDao：通过业务分析，得到结果：需要提供两个方法
> 按用户名查询用户对象：UserfindByUsername(String username)
> 插入一个用户到数据库中：voidadd(User user)
工作：
1. 在service层添加一个UserException
2. dao；
*User findByUsername(String username)
*void add(User user)
3. service
*void regist() throws UserException
4. servlet
1).封装表单数据到User对象中
2).使用user调用service的regist()方法
3). 如果得到UserException，那么把异常信息保存到request域中，转发回regist.jsp，（数据的回显）
4). 输出“注册成功”
-------------------
给注册添加验证码
1. VerifyCode类
*BufferedImage getImage() --> 获取随机的验证码图片
*String getText() --> 获取图片上的文本
*static output(BfferedImage, OutputStream) --> 把图片写入到指定的输出流中。
2. VerifyCodeServlet
* 获取随机验证码图片
* 把验证码图片上的文本保存到session中
* 把图片响应到response的outputStream中
3. regist.jsp
* 添加<img src="指向Servlet" />
* 添加一个文本框，用来输入验证码
* “看不清，换一张”，是一个超链接。把上面的<img>的src重新再次指向Servlet！为了处理浏览器的缓存，需要使用时间来做参数！
4. 修改RegistServlet
* 校验验证码！
* 错误：保存表单数据到request域、保存错误信息到request域，转发回regist.jsp
* 正确：什么都不做，向下执行原来代码！
-------------------
服务器端表单（输入）校验
我们把这段校验，放到获取表单数据之后，验证码校验之前！
1. 使用Map类型来装载错误信息！
*key：表单项名称，例如：username、password、verifyCode
*value：
> 非空：用户名不能为空，或者是“密码不能为空”
> 长度：用户名长度必须在3~20之间 密码长度必须在3~20之间
2. 在校验失败时，向map添加错误信息！那个字段出错，就给哪个字段添加错误信息！
3. 判断map是否为空（长度是否为0），如果不空，说明有错误存在，保存map到request域，保存form到request域（回显），转发回regist.jsp
4. 在regist.jsp页面中，显示map中的错误信息。${map.username}
=================================
=================================
=================================
登录功能
页面：login.jsp--> 登录表单！
LoginServlet -->
1. 获取表单数据，封装到User中
2. 调用service的login()方法，传递form过去！
3. 如果service的login()方法，没有抛出异常！返回一个User对象！
4. 有异常：获取异常信息，保存到request域，保存form，转发到login.jsp
5. 没异常：保存返回的user对象到session中！！！重定向到welcome.jsp(显示当前用户信息！)
UserService#login()
public User login(User form) {...}
1. 使用用户名查询数据库，得到返回的User
> 返回为null，抛出异常，异常信息为（用户名不存在）
> 返回不为null，获取查询出来的user的password与form的password进行比较！如果不同：抛出异常（密码错误！）\
> 如果相同，返回查询结果！
UserDao
1. 通过用户名查询用户！(已经存在了，不用再写了！)
====================================================
代码
服务器端表单校验(写入校验)
在jsp相应表单行添加map的全域属性查找显示(略)
/*
* 添加新任务（表单校验）
* 1. 创建一个Map，用来装载所有的表单错误信息
* 在校验过程中，如果失败，向map添加错误信息，其中key为表单字段名称
* 2. 校验之后，查看map长度是否大于0，如果大于0，说明有错误信息，就是有错误！
* > 保存map到request中，保存form到request中，转发到regist.jsp
*
* 3. 如果map为空，说明没有错误信息，向下执行！
*/
// 用来装载所有错误信息
Map<String,String> errors = new HashMap<String,String>();
// 对用户名进行校验
String username = form.getUsername();//获取表单的username
if(username == null || username.trim().isEmpty()) {
errors.put("username", "用户名不能为空！");
} else if(username.length() < 3 || username.length() > 15) {
errors.put("username", "用户名长度必须在3~15之间！");
}
// 对密码进行校验
String password = form.getPassword();
if(password == null || password.trim().isEmpty()) {
errors.put("password", "密码不能为空！");
} else if(password.length() < 3 || password.length() > 15) {
errors.put("password", "密码长度必须在3~15之间！");
}
// 对验证码进行校验
String sessionVerifyCode = (String) request.getSession().getAttribute("session_vcode");
String verifyCode = form.getVerifyCode();
if(verifyCode == null || verifyCode.trim().isEmpty()) {
errors.put("verifyCode", "验证码不能为空！");
} else if(verifyCode.length() != 4) {
errors.put("verifyCode", "验证码长度必须为4！");
} else if(!verifyCode.equalsIgnoreCase(sessionVerifyCode)) {
errors.put("verifyCode", "验证码错误！");
}
/*
* 判断map是否为空，不为空，说明存在错误
*/
if(errors != null && errors.size() > 0) {
/*
* 1. 保存errors到request域
* 2. 保存form到request域，为了回显
* 3. 转发到regist.jsp
*/
request.setAttribute("errors", errors);
request.setAttribute("user", form);
request.getRequestDispatcher("/user/regist.jsp").forward(request, response);
return;
}
UserDao
public class UserDao {
private String path;
public UserDao() {
path = this.getClass().getResource("/users.xml").getPath();
}
public void add(User user) {
try {
SAXReader reader = new SAXReader();
Document doc = reader.read(path);
Element root = doc.getRootElement();
Element userEle = root.addElement("user");
userEle.addAttribute("username", user.getUsername());
userEle.addAttribute("password", user.getPassword());
// 创建格式化器，使用\t缩进，添加换行
OutputFormat format = new OutputFormat("\t", true);
// 清空数据中原有的换行
format.setTrimText(true);
// 创建XML输出流对象
XMLWriter writer = new XMLWriter(new FileWriter(path), format);
// 输出Document
writer.write(doc);
// 关闭流
writer.close();
} catch (Exception e) {
throw new RuntimeException(e);
}
}
public User findByUsername(String username) {
try {
SAXReader reader = new SAXReader();
Document doc = reader.read(path);
Element ele = (Element) doc.selectSingleNode("//user[@username='" + username + "']");
if(ele == null) {
return null;
}
User user = new User();
user.setUsername(ele.attributeValue("username"));
user.setPassword(ele.attributeValue("password"));
return user;
} catch (Exception e) {
throw new RuntimeException(e);
}
}
}
UserService
public class UserService {
private UserDao userDao = new UserDao();
public User login(String username, String password) throws UserException {
User user = userDao.findByUsername(username);
if(user == null) {
throw new UserException("用户名错误！");
}
if(!user.getPassword().equals(password)) {
throw new UserException("密码错误！");
}
return user;
}
public void regist(User user) throws UserException {
User _user = userDao.findByUsername(user.getUsername());
if(_user != null) {
throw new UserException("用户名已注册！");
}
userDao.add(user);
}
}
UserException
public class UserException extends Exception {
public UserException() {}
public UserException(String message, Throwable cause) {
super(message, cause);
}
public UserException(String message) {
super(message);
}
public UserException(Throwable cause) {
super(cause);
}
}
QuitServlet
public class QuitServlet extends HttpServlet {
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
// 使session失效
request.getSession().invalidate();
response.sendRedirect(request.getContextPath() + "/index.jsp");
}
}
LoginServlet
public class LoginServlet extends HttpServlet {
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
request.setCharacterEncoding("utf-8");
response.setContentType("text/html;charset=utf-8");
String username = request.getParameter("username");
String password = request.getParameter("password");
String loginCode = request.getParameter("loginCode");
if(username == null || username.trim().isEmpty()) {
request.setAttribute("msg", "用户名不能为空!");
request.setAttribute("username", username);
request.getRequestDispatcher("/login.jsp").forward(request, response);
return;
}
if(password == null || password.trim().isEmpty()) {
request.setAttribute("msg", "密码不能为空!");
request.setAttribute("username", username);
request.getRequestDispatcher("/login.jsp").forward(request, response);
return;
}
if(loginCode == null || loginCode.trim().isEmpty()) {
request.setAttribute("msg", "验证码不能为空！");
request.setAttribute("username", username);
request.getRequestDispatcher("/login.jsp").forward(request, response);
return;
}
String vCode = (String)request.getSession().getAttribute("loginCode");
request.getSession().removeAttribute("loginCode");
if(!vCode.equalsIgnoreCase(loginCode)) {
request.setAttribute("msg", "验证码错误！");
request.setAttribute("username", username);
request.getRequestDispatcher("/login.jsp").forward(request, response);
return;
}
UserService userService = new UserService();
User user;
try {
user = userService.login(username, password);
} catch (UserException e) {
request.setAttribute("msg", e.getMessage());
request.setAttribute("username", username);
request.getRequestDispatcher("/login.jsp").forward(request, response);
return;
}
request.getSession().setAttribute("user", user);
request.getRequestDispatcher("/index.jsp").forward(request, response);
}
}
RegistServlet
public class RegistServlet extends HttpServlet {
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
request.setCharacterEncoding("utf-8");
response.setContentType("text/html;charset=utf-8");
User user = new User();
try {
BeanUtils.populate(user, request.getParameterMap());
} catch (Exception e) {
}
String loginCode = request.getParameter("registCode");
String repassword = request.getParameter("repassword");
if(user.getUsername() == null || user.getUsername().trim().isEmpty()) {
request.setAttribute("msg", "用户名不能为空!");
request.setAttribute("user", user);
request.getRequestDispatcher("/regist.jsp").forward(request, response);
return;
}
if(user.getPassword() == null || user.getPassword().trim().isEmpty()) {
request.setAttribute("msg", "密码不能为空!");
request.setAttribute("user", user);
request.getRequestDispatcher("/regist.jsp").forward(request, response);
return;
}
if(!user.getPassword().equals(repassword)) {
request.setAttribute("msg", "两次输入不一致！");
request.setAttribute("user", user);
request.getRequestDispatcher("/regist.jsp").forward(request, response);
return;
}
if(loginCode == null || loginCode.trim().isEmpty()) {
request.setAttribute("msg", "验证码不能为空！");
request.setAttribute("user", user);
request.getRequestDispatcher("/regist.jsp").forward(request, response);
return;
}
String vCode = (String)request.getSession().getAttribute("registCode");
request.getSession().removeAttribute("registCode");
if(!vCode.equalsIgnoreCase(loginCode)) {
request.setAttribute("msg", "验证码错误！");
request.setAttribute("user", user);
request.getRequestDispatcher("/regist.jsp").forward(request, response);
return;
}
UserService userService = new UserService();
try {
userService.regist(user);
request.getRequestDispatcher("/login.jsp").forward(request, response);
} catch (UserException e) {
request.setAttribute("msg", e.getMessage());
request.setAttribute("user", user);
request.getRequestDispatcher("/regist.jsp").forward(request, response);
return;
}
}
}
VerifyCodeServlet
public class VerifyCodeServlet extends HttpServlet {
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
String name = request.getParameter("name");
VerifyCode vc = new VerifyCode();//创建验证码类
BufferedImage image = vc.getImage();//创建验证码图片
request.getSession().setAttribute(name, vc.getText());//获取验证码文本
System.out.println(vc.getText());
VerifyCode.output(image, response.getOutputStream());//输出图片到页面
}
}
index.jsp
<body>
<h1>主页</h1>
<hr/>
<c:choose>
<c:when test="${empty sessionScope.user }">
您还没有登录
</c:when>
<c:otherwise>
用户名：${sessionScope.user.username }
<a href="<c:url value='/QuitServlet'/>">退出</a>
</c:otherwise>
</c:choose>
</body>
regist.jsp
<body>
<h1>注册</h1>
<hr/>
<p style="font-weight: 900; color: red;">${msg }</p>
<form action="<c:url value='/RegistServlet'/>" method="post">
用户名：<input type="text" name="username" value="${user.username }" /><br/>
密 码：<input type="password" name="password"/><br/>
确认密码：<input type="password" name="repassword"/><br/>
验证码：<input type="text" name="registCode" size="2"/>
<img id="vCode" src="<c:url value='/VerifyCodeServlet?name=registCode'/>" border="2"/>
<a href="javascript:_change()" style="font-size: 12;">看不清，换一张</a><br/>
<input type="submit" value="注册"/>
</form>
</body>
<script type="text/javascript">
function _change() {
var img = document.getElementById("vCode");
img.src = "<c:url value='/VerifyCodeServlet?name=registCode&'/>" + new Date().getTime();
}
</script>
login.jsp
<body>
<h1>登录</h1>
<hr/>
<p style="font-weight: 900; color: red;">${msg }</p>
<form action="<c:url value='/LoginServlet'/>" method="post">
用户名：<input type="text" name="username" value="${user.username }" /><br/>
密 码：<input type="password" name="password"/><br/>
验证码：<input type="text" name="loginCode" size="2"/>
<img id="vCode" src="<c:url value='/VerifyCodeServlet?name=loginCode'/>" border="2"/>
<a href="javascript:_change()" style="font-size: 12;">看不清，换一张</a><br/>
<input type="submit" value="登录"/>
</form>
</body>
<script type="text/javascript">
function _change() {
var img = document.getElementById("vCode");
img.src = "<c:url value='/VerifyCodeServlet?name=loginCode&'/>" + new Date().getTime();
}
</script>