JavaWeb-综合案例(用户信息)-学习笔记02【登录功能】
生活随笔
收集整理的這篇文章主要介紹了
JavaWeb-综合案例(用户信息)-学习笔记02【登录功能】
小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.
- Java后端 學習路線 筆記匯總表【黑馬程序員】
目錄
第1節(jié) 登錄功能
今日內容
頁面調整
內聯(lián)表單
分頁
list.jsp
登錄功能_驗證碼顯示
CheckCodeServlet.java // 驗證碼的實現(xiàn)代碼
login.jsp
修改表結構
登錄功能_代碼實現(xiàn)
LoginServlet.java
登錄頁面 實現(xiàn)效果
第1節(jié) 登錄功能
今日內容
1. 綜合練習
?? ?1. 簡單功能
?? ??? ?1. 列表查詢
?? ??? ?2. 登錄
?? ??? ?3. 添加
?? ??? ?4. 刪除
?? ??? ?5. 修改
?? ??? ?
?? ?2. 復雜功能
?? ??? ?1. 刪除選中
?? ??? ?2. 分頁查詢
?? ??? ??? ?* 好處：
?? ??? ??? ??? ?1. 減輕服務器內存的開銷
?? ??? ??? ??? ?2. 提升用戶體驗
?? ??? ?3. 復雜條件查詢
登錄
1. 調整頁面，加入驗證碼功能
2. 代碼實現(xiàn)
頁面調整
內聯(lián)表單
分頁
list.jsp
<%@ page contentType="text/html;charset=UTF-8" language="java" %> <%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> <!DOCTYPE html> <!-- 網(wǎng)頁使用的語言 --> <html lang="zh-CN"> <head><!-- 指定字符集 --><meta charset="utf-8"><!-- 使用Edge最新的瀏覽器的渲染方式 --><meta http-equiv="X-UA-Compatible" content="IE=edge"><!-- viewport視口：網(wǎng)頁可以根據(jù)設置的寬度自動進行適配，在瀏覽器的內部虛擬一個容器，容器的寬度與設備的寬度相同。width: 默認寬度與設備的寬度相同initial-scale: 初始的縮放比，為1:1 --><meta name="viewport" content="width=device-width, initial-scale=1"><!-- 上述3個meta標簽*必須*放在最前面，任何其他內容都*必須*跟隨其后！ --><title>用戶信息管理系統(tǒng)</title><!-- 1. 導入CSS的全局樣式 --><link href="css/bootstrap.min.css" rel="stylesheet"><!-- 2. jQuery導入，建議使用1.9以上的版本 --><script src="js/jquery-2.1.0.min.js"></script><!-- 3. 導入bootstrap的js文件 --><script src="js/bootstrap.min.js"></script><style type="text/css">td, th {text-align: center;}</style> </head> <body> <div class="container"><h3 style="text-align: center">用戶信息列表</h3><div style="float: left;"><form class="form-inline"><div class="form-group"><label for="exampleInputName2">姓名</label><input type="text" class="form-control" id="exampleInputName2"></div><div class="form-group"><label for="exampleInputName3">籍貫</label><input type="text" class="form-control" id="exampleInputName3"></div><div class="form-group"><label for="exampleInputEmail2">郵箱</label><input type="email" class="form-control" id="exampleInputEmail2"></div><button type="submit" class="btn btn-default">查詢</button></form></div><div style="float: right;margin: 5px;"><a class="btn btn-primary" href="add.html">添加聯(lián)系人</a><a class="btn btn-primary" href="add.html">刪除選中</a></div><table border="1" class="table table-bordered table-hover"><tr class="success"><th><input type="checkbox"></th><th>編號</th><th>姓名</th><th>性別</th><th>年齡</th><th>籍貫</th><th>QQ</th><th>郵箱</th><th>操作</th></tr><c:forEach items="${users}" var="user" varStatus="s"><tr><td><input type="checkbox"></td><td>${s.count}</td><td>${user.name}</td><td>${user.gender}</td><td>${user.age}</td><td>${user.address}</td><td>${user.qq}</td><td>${user.email}</td><td><a class="btn btn-default btn-sm" href="update.html">修改</a> <a class="btn btn-default btn-sm" href="">刪除</a></td></tr></c:forEach></table><div><nav aria-label="Page navigation"><ul class="pagination"><li><a href="#" aria-label="Previous"><span aria-hidden="true">«</span></a></li><li><a href="#">1</a></li><li><a href="#">2</a></li><li><a href="#">3</a></li><li><a href="#">4</a></li><li><a href="#">5</a></li><li><a href="#" aria-label="Next"><span aria-hidden="true">»</span></a></li><span style="font-size: 25px;margin-left: 5px;">共16條記錄，共4頁</span></ul></nav></div> </div> </body> </html>登錄功能_驗證碼顯示
CheckCodeServlet.java // 驗證碼的實現(xiàn)代碼
package cn.itcast.web.servlet;import javax.imageio.ImageIO; import javax.servlet.ServletException; import javax.servlet.annotation.WebServlet; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import java.awt.*; import java.awt.image.BufferedImage; import java.io.IOException; import java.util.Random;/*** 驗證碼*/ @WebServlet("/checkCodeServlet") public class CheckCodeServlet extends HttpServlet {public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {//服務器通知瀏覽器不要緩存response.setHeader("pragma", "no-cache");response.setHeader("cache-control", "no-cache");response.setHeader("expires", "0");//在內存中創(chuàng)建一個長80，寬30的圖片，默認黑色背景//參數(shù)一：長//參數(shù)二：寬//參數(shù)三：顏色int width = 80;int height = 30;BufferedImage image = new BufferedImage(width, height, BufferedImage.TYPE_INT_RGB);//獲取畫筆Graphics g = image.getGraphics();//設置畫筆顏色為灰色g.setColor(Color.GRAY);//填充圖片g.fillRect(0, 0, width, height);//產(chǎn)生4個隨機驗證碼，12EyString checkCode = getCheckCode();//將驗證碼放入HttpSession中request.getSession().setAttribute("CHECKCODE_SERVER", checkCode);//設置畫筆顏色為黃色g.setColor(Color.YELLOW);//設置字體的小大g.setFont(new Font("黑體", Font.BOLD, 24));//向圖片上寫入驗證碼g.drawString(checkCode, 15, 25);//將內存中的圖片輸出到瀏覽器//參數(shù)一：圖片對象//參數(shù)二：圖片的格式，如PNG,JPG,GIF//參數(shù)三：圖片輸出到哪里去ImageIO.write(image, "PNG", response.getOutputStream());}/*** 產(chǎn)生4位隨機字符串*/private String getCheckCode() {String base = "0123456789ABCDEFGabcdefg";int size = base.length();Random r = new Random();StringBuffer sb = new StringBuffer();for (int i = 1; i <= 4; i++) {//產(chǎn)生0到size-1的隨機值int index = r.nextInt(size);//在base字符串中獲取下標為index的字符char c = base.charAt(index);//將c放入到StringBuffer中去sb.append(c);}return sb.toString();}public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {this.doGet(request, response);} }login.jsp
<img src="${pageContext.request.contextPath}/checkCodeServlet" title="看不清點擊刷新" id="vcode"/>
<%@ page contentType="text/html;charset=UTF-8" language="java" %> <!DOCTYPE html> <html lang="zh-CN"> <head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge"/><meta name="viewport" content="width=device-width, initial-scale=1"/><title>管理員登錄</title><!-- 1. 導入CSS的全局樣式 --><link href="css/bootstrap.min.css" rel="stylesheet"><!-- 2. jQuery導入，建議使用1.9以上的版本 --><script src="js/jquery-2.1.0.min.js"></script><!-- 3. 導入bootstrap的js文件 --><script src="js/bootstrap.min.js"></script><script type="text/javascript">//切換驗證碼function refreshCode() {//1.獲取驗證碼圖片對象var vcode = document.getElementById("vcode");//2.設置其src屬性，加時間戳vcode.src = "${pageContext.request.contextPath}/checkCodeServlet?time=" + new Date().getTime();}</script> </head> <body> <div class="container" style="width: 400px;"><h3 style="text-align: center;">管理員登錄</h3><form action="${pageContext.request.contextPath}/loginServlet" method="post"><div class="form-group"><label for="user">用戶名：</label><input type="text" name="username" class="form-control" id="user" placeholder="請輸入用戶名"/></div><div class="form-group"><label for="password">密碼：</label><input type="password" name="password" class="form-control" id="password" placeholder="請輸入密碼"/></div><div class="form-inline"><label for="vcode">驗證碼：</label><input type="text" name="verifycode" class="form-control" id="verifycode" placeholder="請輸入驗證碼" style="width: 120px;"/><a href="javascript:refreshCode();"><img src="${pageContext.request.contextPath}/checkCodeServlet" title="看不清點擊刷新" id="vcode"/></a></div><hr/><div class="form-group" style="text-align: center;"><input class="btn btn btn-primary" type="submit" value="登錄"></div></form><!-- 出錯顯示的信息框 --><div class="alert alert-warning alert-dismissible" role="alert"><button type="button" class="close" data-dismiss="alert"><span>×</span></button><strong>${login_msg}</strong></div> </div> </body> </html>修改表結構
登錄功能_代碼實現(xiàn)
LoginServlet.java
package cn.itcast.web.servlet;import cn.itcast.domain.User; import cn.itcast.service.UserService; import cn.itcast.service.impl.UserServiceImpl; import org.apache.commons.beanutils.BeanUtils;import javax.servlet.ServletException; import javax.servlet.annotation.WebServlet; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import javax.servlet.http.HttpSession; import java.io.IOException; import java.lang.reflect.InvocationTargetException; import java.util.Map;@WebServlet("/loginServlet") public class LoginServlet extends HttpServlet {protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {//1.設置編碼request.setCharacterEncoding("utf-8");//2.獲取數(shù)據(jù)//2.1獲取用戶填寫驗證碼String verifycode = request.getParameter("verifycode");//3.驗證碼校驗HttpSession session = request.getSession();String checkcode_server = (String) session.getAttribute("CHECKCODE_SERVER");session.removeAttribute("CHECKCODE_SERVER");//確保驗證碼一次性if (!checkcode_server.equalsIgnoreCase(verifycode)) {//驗證碼不正確//提示信息request.setAttribute("login_msg", "驗證碼錯誤！");//跳轉登錄頁面request.getRequestDispatcher("/login.jsp").forward(request, response);return;}Map<String, String[]> map = request.getParameterMap();//4.封裝User對象User user = new User();try {BeanUtils.populate(user, map);} catch (IllegalAccessException e) {e.printStackTrace();} catch (InvocationTargetException e) {e.printStackTrace();}//5.調用Service查詢UserService service = new UserServiceImpl();User loginUser = service.login(user);//6.判斷是否登錄成功if (loginUser != null) {//登錄成功//將用戶存入sessionsession.setAttribute("user", loginUser);//跳轉頁面response.sendRedirect(request.getContextPath() + "/index.jsp");} else {//登錄失敗//提示信息request.setAttribute("login_msg", "用戶名或密碼錯誤！");//跳轉登錄頁面request.getRequestDispatcher("/login.jsp").forward(request, response);}}protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {this.doPost(request, response);} }登錄頁面 實現(xiàn)效果
??
總結
以上是生活随笔為你收集整理的JavaWeb-综合案例(用户信息)-学习笔记02【登录功能】的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： JavaWeb-综合案例(用户信息)-学
- 下一篇： 边缘生——保研与考研到底如何抉择！