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>