JavaWeb簡單實現記住密碼以及自動填充功能

時間 2020-08-18

原文原文鏈接

使用技術 jQuery druid MySQL Jackson AJAX JSONjavascript

話很少說直接上代碼
智匯代理申請https://www.kaifx.cn/broker/t...css

–JSP頁面html

<%--
  Created by IntelliJ IDEA.
  User: QiLin
  Date: 2020/7/28
  Time: 13:55
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<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>
    <script src="js/jquery.min.js"></script>
    <!-- 3. 導入bootstrap的js文件 -->
    <script src="js/bootstrap.min.js"></script>
    <script type="text/javascript">
    </script>
</head>
<body>
<div class="container" style="width: 400px;">
    <h3 style="text-align: center;">管理員登陸</h3>
    <form action="Login" method="post">
        <div class="form-group">
            <label for="user">用戶名：</label>
            <input type="text" name="user" 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="Check_card" title="看不清點擊刷新" id="vcode"/></a>
        </div>
        <hr/>
        <div class="form-group" style="text-align: center;">
            <c:if test="${not empty sessionScope.jzmmm}">
            記住密碼&nbsp;&nbsp;<input type="radio" name="cookie" checked value="true"><br>
            </c:if>
            <c:if test="${empty sessionScope.jzmmm}">
                記住密碼&nbsp;&nbsp;<input type="radio" name="cookie"  value="true"><br>
            </c:if>

            <input  class="btn btn btn-primary" type="submit" value="登陸">
        </div>
    </form>
    <span id="a"></span>
    <span id="b"></span>

    <!-- 出錯顯示的信息框 -->
    <c:if test="${not empty sessionScope.msg1 || not empty sessionScope.msg2}">
    <div class="alert alert-warning alert-dismissible" role="alert">
        <button type="button" class="close" data-dismiss="alert" >
            <span style="color:red;">${sessionScope.msg1}</span>
            <span style="color:crimson;">${sessionScope.msg2}</span>
        </button>
        <strong>登陸失敗!</strong>
    </div>
    </c:if>
</div>
</body>
</html>
<script>
    $(function () {
    //密碼重置爲空
        $("#user").keydown(function () {
            $("#password").val("");
        });
        //刷新驗證碼
        $("#vcode").click(function () {
            var s= new Date().getTime();
            this.src = "Check_card?time="+s;
        });
        //填充密碼
        $("#user").blur(function () {
            $.post("GetCookie",{uname:$(this).val()},function (data) {
                    $("#password").val(JSON.parse(data));
                }
            );
        });
    });
</script>

Servlet—登陸java

package web;

import service.UserService;
import service.impl.UserServiceImpl;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.*;
import java.io.IOException;
import java.net.URL;
import java.net.URLEncoder;

/**
 * @author: QiLin
 * @date: 2020/8/1 14:32
 * @version: 1.0
 */
@WebServlet( "/Login")
public class Login extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        request.setCharacterEncoding("utf-8");
        String user = request.getParameter("user");
        String pwd = request.getParameter("password");
        String code = request.getParameter("verifycode");
        String jzmm = request.getParameter("cookie");
        String check_card = (String) request.getSession().getAttribute("check_card");
        HttpSession session = request.getSession();
        if (code.equalsIgnoreCase(check_card)) {
            UserService userService = new UserServiceImpl();
            int login = userService.login(user, pwd);
            if (login == 1) {
                if ( jzmm !=null && jzmm.equals("true") ) {
                    String username = URLEncoder.encode(user,"UTF-8");
                    String userpwd = URLEncoder.encode(user+"pwd","UTF-8");
                    Cookie name = new Cookie(username,username);
                    Cookie pwdpwd = new Cookie(userpwd,pwd);
                    Cookie jzmmm = new Cookie("jzmm",jzmm);
                    name.setMaxAge(1*60*60);
                    pwdpwd.setMaxAge(1*60*60);
                    jzmmm.setMaxAge(1*60*60);
                    session.setAttribute("username", user);
                    session.setAttribute("password", pwd);
                    response.addCookie(name);
                    response.addCookie(pwdpwd);
                    response.addCookie(jzmmm);
                    request.setAttribute("user",user);
                    request.getRequestDispatcher("index.jsp").forward(request,response);
                } else {
                    request.setAttribute("user",user);
                    request.getRequestDispatcher("index.jsp").forward(request,response);
                }
            } else {
                session.removeAttribute("msg1");
                session.setAttribute("msg2","用戶名或密碼錯誤");
                response.sendRedirect("login.jsp");
            }
        } else {
            session.removeAttribute("msg2");
            session.setAttribute("msg1","驗證碼錯誤");
            response.sendRedirect("login.jsp");
        }
    }

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        doPost(request, response);
    }
}

Servlet—獲取密碼jquery

package web;

import com.fasterxml.jackson.databind.ObjectMapper;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.*;
import java.io.IOException;
import java.net.URLDecoder;
import java.net.URLEncoder;

/**
 * @author: QiLin
 * @date: 2020/8/2 14:09
 * @version: 1.0
 */
@WebServlet( "/GetCookie")
public class GetCookie extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        response.setContentType("text/html;charset=utf-8");
        String user = request.getParameter("uname");
        String password = "";
        ObjectMapper mapper = new ObjectMapper();
        // 獲取cookie
        Cookie[] cookies = request.getCookies();
        // 若是爲空，則停留在該頁面
         if(cookies !=null || cookies.length >0) {
            String username = URLEncoder.encode(user,"UTF-8");
            String userpwd = URLEncoder.encode(user+"pwd","UTF-8");
            for (int i = 0; i < cookies.length; i++) {
                if (cookies[i].getName().equals(username)) {
                    user = URLDecoder.decode(cookies[i].getValue(),"UTF-8");
                }
                if (cookies[i].getName().equals(userpwd)) {
                    password = cookies[i].getValue();
                }
            }
            request.setAttribute("pwd",password);
            String pwd = mapper.writeValueAsString(request.getAttribute("pwd"));
            response.getWriter().write(pwd);
        }
    }

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        doPost(request, response);
    }
}

Servlet—驗證碼web

package web;

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;

/**
 * @author: QiLin
 * @date: 2020/8/1 13:52
 * @version: 1.0
 */
@WebServlet( "/Check_card")
public class Check_card extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        //設置寬高
        int width = 100;
        int height = 50;
        //建立對象，在內存驗證碼圖
        BufferedImage image = new BufferedImage(width,height,BufferedImage.TYPE_INT_BGR);
        //美化圖片
        Graphics graphics = image.getGraphics();
        //畫邊框
        graphics.setColor(Color.magenta);
        graphics.drawRect(0,0,width-1,height-1);
        //填充背景顏色
        graphics.setColor(Color.cyan);//畫筆顏色
        graphics.drawRect(0,0,width,height);
        //定義隨機抽取池
        String str = "QWERTYUIOPASDFGHJKLZXCVBNMqwertyuioplkjhgfdsazxcvbnm0123456789";
        //生成隨機角標
        Random ran = new Random();
        //接收驗證碼
        StringBuffer sb = new StringBuffer();
        //寫入驗證碼
        for (int i = 1; i <= 4; i++) {
            int index = ran.nextInt(str.length());
            //獲取隨機字符
            char c = str.charAt(index);
            sb.append(c);
//            //生成隨機x軸
//            int x = ran.nextInt(width-10) % (width-10-10+1)+10;
//            //生成隨機y軸
//            int y = ran.nextInt(height-5) % (width-5-5+1)+5;
            graphics.setFont(new Font("Tahoma", Font.BOLD, 18));
            graphics.drawString(c+"",width/5*i,height/2);
        }
        //存入session
        String session_check = sb.toString();
        request.getSession().setAttribute("check_card",session_check);
        //畫干擾線
        graphics.setColor(Color.green);
        for (int i = 0; i < 10; i++) {
            int x1 = ran.nextInt(width);
            int x2 = ran.nextInt(width);
            int y1 = ran.nextInt(height);
            int y2 = ran.nextInt(height);
            graphics.drawLine(x1,y1,x2,y2);
        }
        //將圖片畫到頁面
        ImageIO.write(image,"jpg",response.getOutputStream());
    }

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        doPost(request, response);
    }
}

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。