一:注册页面:regist.jsp:
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Insert title here</title> <script type="text/javascript"> function changeImg(){ document.getElementById("myImg").src='${pageContext.request.contextPath}/servlet/CheckCodeServlet?' + new Date().getTime(); } function validataForm(){ var username = document.getElementById("username").value; if(username == ""){ alert("用户名不能为空!"); return false; } var password = document.getElementById("password").value; if(password == ""){ alert("密码不能为空!"); return false; } var repassword = document.getElementById("repassword").value; if(password != repassword){ alert("两次密码不一致!"); return false; } var email = document.getElementById("email").value; if(email.match("^\s*\w+(?:\.{0,1}[\w-]+)*@[a-zA-Z0-9]+(?:[-.][a-zA-Z0-9]+)*\.[a-zA-Z]+\s*$")==null){ alert("哥们儿,邮箱地址非法"); return false; } } </script> </head> <body> <form action="${pageContext.request.contextPath }/servlet/RegistServlet" onsubmit="return validataForm();" method="post"> <table> <tr> <td>用户名:</td> <td><input type="text" name="username" id="username"></td> </tr> <tr> <td>密码:</td> <td><input type="passoword" name="password" id="password"></td> </tr> <tr> <td>确认密码:</td> <td><input type="password" name="repassword" id="repassword"></td> </tr> <tr> <td>邮箱:</td> <td><input type="text" name="email" id="email"></td> </tr> <tr> <td>验证码:</td> <td> <input type="text" name="checkcode"> <img src="${pageContext.request.contextPath }/servlet/CheckCodeServlet" onclick="changeImg();" style="cursor: pointer;" id="myImg"></td> </tr> <tr> <td></td> <td><input type="submit" value="注册"></td> </tr> </table> </form> </body> </html>
二:.验证码servlet:CheckCodeServlet.java
完成页面显示验证码的效果:
package com.itcode.view; import java.awt.Color; import java.awt.Font; import java.awt.Graphics; import java.awt.Graphics2D; import java.awt.image.BufferedImage; import java.io.IOException; import java.util.Random; import javax.imageio.ImageIO; import javax.servlet.ServletException; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; public class CheckCodeServlet extends HttpServlet { // ctrl + shift +X 变大写 ----------- Y private final int WIDTH = 120; private final int HEIGHT = 30; public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setHeader("cache-control", "no-cache"); response.setHeader("pragma", "no-cache"); response.setDateHeader("expires", -1); // 1.在内存中构建出一张 图片 BufferedImage image = new BufferedImage(WIDTH, HEIGHT, BufferedImage.TYPE_INT_RGB); Graphics2D graphics = (Graphics2D) image.getGraphics(); // 将 背景设置 为 白色 . graphics.setColor(Color.WHITE); graphics.fillRect(0, 0, WIDTH, HEIGHT); // 状态机 // 画 矩形 . 之前 由于已经设置 过 颜色 ,就相当于 维护了 一个状态机, 所以 你需要 再次调用 setCorlor , 否则 就看不到 你 画 的矩形了 . graphics.setColor(Color.BLUE); graphics.drawRect(0, 0, WIDTH-1, HEIGHT-1); // 准备好 要 使用的 汉字. // String base ="ABCDEFGHIJKLMNOPQRST"; String base = "u7684u4e00u4e86u662fu6211u4e0du5728u4ebau4eecu6709u6765u4ed6u8fd9u4e0au7740u4e2au5730u5230u5927u91ccu8bf4u5c31u53bbu5b50u5f97u4e5fu548cu90a3u8981u4e0bu770bu5929u65f6u8fc7u51fau5c0fu4e48u8d77u4f60u90fdu628au597du8fd8u591au6ca1u4e3au53c8u53efu5bb6u5b66u53eau4ee5u4e3bu4f1au6837u5e74u60f3u751fu540cu8001u4e2du5341u4eceu81eau9762u524du5934u9053u5b83u540eu7136u8d70u5f88u50cfu89c1u4e24u7528u5979u56fdu52a8u8fdbu6210u56deu4ec0u8fb9u4f5cu5bf9u5f00u800cu5df1u4e9bu73b0u5c71u6c11u5019u7ecfu53d1u5de5u5411u4e8bu547du7ed9u957fu6c34u51e0u4e49u4e09u58f0u4e8eu9ad8u624bu77e5u7406u773cu5fd7u70b9u5fc3u6218u4e8cu95eeu4f46u8eabu65b9u5b9eu5403u505au53ebu5f53u4f4fu542cu9769u6253u5462u771fu5168u624du56dbu5df2u6240u654cu4e4bu6700u5149u4ea7u60c5u8defu5206u603bu6761u767du8bddu4e1cu5e2du6b21u4eb2u5982u88abu82b1u53e3u653eu513fu5e38u6c14u4e94u7b2cu4f7fu5199u519bu5427u6587u8fd0u518du679cu600eu5b9au8bb8u5febu660eu884cu56e0u522bu98deu5916u6811u7269u6d3bu90e8u95e8u65e0u5f80u8239u671bu65b0u5e26u961fu5148u529bu5b8cu5374u7ad9u4ee3u5458u673au66f4u4e5du60a8u6bcfu98ceu7ea7u8ddfu7b11u554au5b69u4e07u5c11u76f4u610fu591cu6bd4u9636u8fdeu8f66u91cdu4fbfu6597u9a6cu54eau5316u592au6307u53d8u793eu4f3cu58ebu8005u5e72u77f3u6ee1u65e5u51b3u767eu539fu62ffu7fa4u7a76u5404u516du672cu601du89e3u7acbu6cb3u6751u516bu96beu65e9u8bbau5417u6839u5171u8ba9u76f8u7814u4ecau5176u4e66u5750u63a5u5e94u5173u4fe1u89c9u6b65u53cdu5904u8bb0u5c06u5343u627eu4e89u9886u6216u5e08u7ed3u5757u8dd1u8c01u8349u8d8au5b57u52a0u811au7d27u7231u7b49u4e60u9635u6015u6708u9752u534au706bu6cd5u9898u5efau8d76u4f4du5531u6d77u4e03u5973u4efbu4ef6u611fu51c6u5f20u56e2u5c4bu79bbu8272u8138u7247u79d1u5012u775bu5229u4e16u521au4e14u7531u9001u5207u661fu5bfcu665au8868u591fu6574u8ba4u54cdu96eau6d41u672au573au8be5u5e76u5e95u6df1u523bu5e73u4f1fu5fd9u63d0u786eu8fd1u4eaeu8f7bu8bb2u519cu53e4u9ed1u544au754cu62c9u540du5440u571fu6e05u9633u7167u529eu53f2u6539u5386u8f6cu753bu9020u5634u6b64u6cbbu5317u5fc5u670du96e8u7a7fu5185u8bc6u9a8cu4f20u4e1au83dcu722cu7761u5174u5f62u91cfu54b1u89c2u82e6u4f53u4f17u901au51b2u5408u7834u53cbu5ea6u672fu996du516cu65c1u623fu6781u5357u67aau8bfbu6c99u5c81u7ebfu91ceu575au7a7au6536u7b97u81f3u653fu57ceu52b3u843du94b1u7279u56f4u5f1fu80dcu6559u70edu5c55u5305u6b4cu7c7bu6e10u5f3au6570u4e61u547cu6027u97f3u7b54u54e5u9645u65e7u795eu5ea7u7ae0u5e2eu5566u53d7u7cfbu4ee4u8df3u975eu4f55u725bu53d6u5165u5cb8u6562u6389u5ffdu79cdu88c5u9876u6025u6797u505cu606fu53e5u533au8863u822cu62a5u53f6u538bu6162u53d4u80ccu7ec6"; Random rand = new Random(); // 设置颜色 graphics.setColor(Color.RED); // 设置 字体 graphics.setFont(new Font("宋体",Font.BOLD,18)); StringBuilder sb = new StringBuilder(); int m =10; // 在for循环中 将 汉字画上去 for (int i = 0; i < 4; i++) { int index = rand.nextInt(base.length()); char charAt = base.charAt(index); // -30 -- 30 int jiaodu = rand.nextInt(60) -30; double theta = jiaodu*Math.PI/180; graphics.rotate(theta, m, 15); graphics.drawString(charAt +"", m, 20); sb.append(charAt); graphics.rotate(-theta, m, 15); m+=25; } // 画 4 条线 graphics.setColor(Color.GREEN); for (int i = 0; i < 4; i++) { int x1 = rand.nextInt(WIDTH); int x2 = rand.nextInt(WIDTH); int y1 = rand.nextInt(HEIGHT); int y2 = rand.nextInt(HEIGHT); // 调用 该方法, 划线 两点 确定 一条直线 . 需要 4 个点 graphics.drawLine(x1, y1, x2, y2); } request.getSession().setAttribute("checkcode_session", sb.toString()); // 释放 graphics 对象, 调用 该方法之后 graphic 就不能再使用了 . graphics.dispose(); // 通过该 imageIO 将 内存中构建好的 图片 与 response的流 给 关联起来. ImageIO.write(image, "png", response.getOutputStream()); } public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { doGet(request, response); } }
三:处理注册的servlet:RegistServlet.java
package com.itcode.controller; import java.io.IOException; import java.lang.reflect.InvocationTargetException; import javax.servlet.ServletException; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import org.apache.commons.beanutils.BeanUtils; import com.itcode.model.User; import com.itcode.model.UserOperator; public class RegistServlet extends HttpServlet { public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { request.setCharacterEncoding("utf-8"); response.setContentType("text/html;charset=utf-8"); response.getWriter().println("成功注册!"); User user = new User(); try { BeanUtils.populate(user, request.getParameterMap()); } catch (IllegalAccessException e) { // TODO Auto-generated catch block e.printStackTrace(); } catch (InvocationTargetException e) { // TODO Auto-generated catch block e.printStackTrace(); } UserOperator userOperator = new UserOperator(); int UserFeedBack = userOperator.regist(user); switch (UserFeedBack) { case UserOperator.USERNAME_EXIST: request.setAttribute("message", "用户名已经在在!"); // response.sendRedirect("/regist.jsp"); request.getRequestDispatcher("/regist.jsp").forward(request, response); break; case UserOperator.EMAIL_EXIST: request.setAttribute("message", "邮箱已经被注册使用!"); request.getRequestDispatcher("/regist.jsp").forward(request, response); break; case UserOperator.SUCCESS: response.sendRedirect("/user/login.jsp");//注意此时的路径与上面的路径的区别! break; default: break; } } public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { doGet(request, response); } }
四:RegistServlet的所需要的类:
User类:
package com.itcode.model; public class User { private String username; private String password; private String email; public String getUsername() { return username; } public void setUsername(String username) { this.username = username; } public String getPassword() { return password; } public void setPassword(String password) { this.password = password; } public String getEmail() { return email; } public void setEmail(String email) { this.email = email; } }
UserOperator类:
package com.itcode.model; import java.io.FileNotFoundException; import java.io.FileOutputStream; import java.io.UnsupportedEncodingException; import java.util.List; import org.dom4j.Document; import org.dom4j.DocumentException; import org.dom4j.DocumentHelper; import org.dom4j.Element; import org.dom4j.io.OutputFormat; import org.dom4j.io.SAXReader; import org.dom4j.io.XMLWriter; public class UserOperator { public static final int USERNAME_EXIST=1; public static final int EMAIL_EXIST=2; public static final int SUCCESS =3; /** * 检验注册用户数据的合法性,并返回相应的状态码。 * @param user * @return int userFeedBack */ public int regist(User user){ SAXReader saxReader = new SAXReader(); Document document =null; try { document = saxReader.read("d://users.xml"); } catch (DocumentException e) { e.printStackTrace(); } //1.得到文件的根标签:users Element rootElement = document.getRootElement(); //2.由根标签得到所有的用户标签:user List<Element> UserElements = rootElement.elements("user"); //3.遍历每个user,以便确保新注册的username,email是未使用过的 for (Element element : UserElements) { if(element.elementText("username").equals(user.getUsername())) return USERNAME_EXIST; if(element.elementText("email").equals(user.getEmail())) return EMAIL_EXIST; } //4.到此说明用户名,邮箱都是未使用过的,就将其加入文件, //4.1创建用户根标签:user Element userEle = DocumentHelper.createElement("user"); //4.2创建username标签,并赋值 Element usernameEle = DocumentHelper.createElement("username"); usernameEle.setText(user.getUsername()); //4.3创建password标签,并赋值 Element passwordEle = DocumentHelper.createElement("password"); passwordEle.setText(user.getPassword()); //4.3创建email标签,并赋值 Element emailEle = DocumentHelper.createElement("email"); emailEle.setText(user.getEmail()); //4.4将创建的各个标签加入到user根标签中 userEle.add(usernameEle); userEle.add(passwordEle); userEle.add(emailEle); //4.5将创建的user标签加入到根标签users中: rootElement.add(userEle); //5.将上述内存中的文件写回到原文件中: XMLWriter xmlWriter =null; OutputFormat format = OutputFormat.createPrettyPrint(); try { xmlWriter = new XMLWriter(new FileOutputStream("d:\users.xml"),format); xmlWriter.write(document); xmlWriter.close(); }catch (Exception e) { e.printStackTrace(); } return SUCCESS; } public User login(User user) { SAXReader saxReader = new SAXReader(); Document document = null; try { document = saxReader.read("d://users.xml"); } catch (Exception e) { e.printStackTrace(); } Element rootElement = document.getRootElement(); List<Element> elements = rootElement.elements("user"); for (Element element : elements) {//如果存在,将此用户,如果不存在,返回空, if(element.elementText("username").equals(user.getUsername()) && element.elementText("password").equals(user.getPassword())){ return user; } } return null; } }
五:登陆页面:login.jsp:
提供让用户填写登陆信息的页面
将用户填写的信息发给LoginServlet:
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Insert title here</title> </head> <body> <font color="green"><h3>${message }</h3></font> <%="fuck you, plealse login!" %> <form action="${pageContext.request.contextPath }/servlet/LoginServlet" method="post"> <table> <tr> <td>用户名:</td> <td><input type="text" name="username" value="${cookie.username.value }"></td> </tr> <tr> <td>密码:</td> <td><input type="password" name="password" value="${cookie.password.value }"></td> </tr> <tr> <td> <input type="checkbox" name="remember" value="off">记住用户名与密码 </td> </tr> <tr> <td><input type="submit" value="登陆"></td> </tr> </table> </form> </body> </html>
六:LoginServlet,查看用户登陆时所填写的信息是否与数据库文件中的相应数据符合,
若符合,则显示登陆成功,若不符合,则请求转发到登陆页面:
package com.itcode.controller; import java.io.IOException; import java.lang.reflect.InvocationTargetException; import javax.servlet.ServletException; import javax.servlet.http.Cookie; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import org.apache.commons.beanutils.BeanUtils; import com.itcode.model.User; import com.itcode.model.UserOperator; public class LoginServlet extends HttpServlet { public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { User user = new User(); try { BeanUtils.populate(user, request.getParameterMap()); } catch (IllegalAccessException e) { // TODO Auto-generated catch block e.printStackTrace(); } catch (InvocationTargetException e) { // TODO Auto-generated catch block e.printStackTrace(); } UserOperator userOperator = new UserOperator(); User existUser = userOperator.login(user); if(existUser == null){ response.getWriter().println("用户名或密码不正确,请重新输入!"); request.getRequestDispatcher("/login.jsp").forward(request, response); }else{//登陆成功后,跳转到首页。在首 页要判断用户是否已经登陆 request.getSession().setAttribute("existUser",existUser); if("on".equals(request.getParameter("remember"))){ //1.将用户名写进cookie // Cookie usernameCookie = new Cookie("username",request.getParameter("username")); Cookie usernameCookie = new Cookie("username",existUser.getUsername()); usernameCookie.setMaxAge(60*12); usernameCookie.setPath("/"); response.addCookie(usernameCookie); System.out.println("-----------22----------------"); //2.将密码写进cookie // Cookie passwordCookie = new Cookie("password",request.getParameter("password")); Cookie passwordCookie = new Cookie("password",existUser.getPassword()); passwordCookie.setMaxAge(60*12); passwordCookie.setPath("/"); response.addCookie(passwordCookie); System.out.println("-----------44----------------"); } response.sendRedirect("/user/index.jsp"); } } public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { doGet(request, response); } }
七:注销成功的实现:
在登录成功后的页面写个注销的超链接,链接到注销Servlet,LogoutServlet.java
package com.itcode.controller; import java.io.IOException; import javax.servlet.ServletException; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; public class LogoutServlet extends HttpServlet { public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { // request.getSession().removeAttribute("existUser"); request.getSession().invalidate(); response.getWriter().println("fuck you have logout!"); response.sendRedirect("/user/index.jsp"); } public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { doGet(request, response); } }
八:为了显示效果,写个首页:
<%@ 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 PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Insert title here</title> </head> <body> <font color="red"><h2>这是首页</h2></font> <hr> <c:if test="${empty existUser }"> 你好,你还没有登陆!<br/> <a href="${pageContext.request.contextPath }/login.jsp">去登陆</a><br/> <a href="${pageContext.request.contextPath }/regist.jsp">去注册</a><br/> </c:if> <c:if test="${not empty existUser }"> ${existUser.username },你好,你已经成功登陆!<br/> <a href="${pageContext.request.contextPath }/servlet/LogoutServlet">去注销</a> </c:if> </body> </html>