验证码登录

生成随机验证码图片:

package com.xuwen.web02.servlet;



import org.apache.commons.lang3.RandomUtils;

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 javax.servlet.http.HttpSession;
import java.awt.*;
import java.awt.image.BufferedImage;
import java.io.BufferedInputStream;
import java.io.IOException;


public class YzmServlet extends HttpServlet {
    private static final int WIDTH = 100;
    private static final int HEIGHT = 40;

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

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        //获取session
        HttpSession session = request.getSession();
        System.out.println(session.getId());
        //产生一张图片
        BufferedImage image = new BufferedImage(WIDTH, HEIGHT, BufferedImage.TYPE_INT_RGB);
        Graphics g = image.getGraphics();
        //设置背景色
        g.setColor(Color.WHITE);
        //填充背景色
        g.fillRect(0,0,WIDTH,HEIGHT);
        //设置前景色
        g.setColor(Color.RED);
        Font font = new Font("微软雅黑",Font.BOLD,20);
        g.setFont(font);
        String str = genRandomString(4);
        session.setAttribute("rndstr",str);
        g.drawString(str,20,30);
        for(int i =0;i<20;i++){
            int x1 = RandomUtils.nextInt(0,WIDTH);
            int x2 = RandomUtils.nextInt(0,WIDTH);
            int y1 = RandomUtils.nextInt(0,HEIGHT);
            int y2 = RandomUtils.nextInt(0,HEIGHT);
            Color color = new Color(RandomUtils.nextInt(0,255),RandomUtils.nextInt(0,255),RandomUtils.nextInt(0,255));
            g.setColor(color);
            g.drawLine(x1,x2,y1,y2);
        }
        //输出图片
        ImageIO.write(image,"jpg",response.getOutputStream());


    }

    private String genRandomString(int len) {
        String result="";
        //获取len个随机字母
        for (int i = 0;i<len;i++){
            char c = (char) RandomUtils.nextInt(65,91);
            result = result+c;
        }
        return result;
    }
}

在servlet中实现对登录信息的验证:

package com.xuwen.web02.servlet;

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;

@WebServlet(name = "Test1Servlet")
public class Test1Servlet extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        doGet(request,response);
    }

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        response.setCharacterEncoding("utf-8");
        response.setContentType("text/html;charset=utf-8");
        request.setCharacterEncoding("utf-8");
        String username = request.getParameter("username");
        String password = request.getParameter("password");
        String yzm1 = request.getParameter("yzm");
        HttpSession session = request.getSession();
        String yzm2 = (String) session.getAttribute("rndstr");
        if (yzm1.equals(yzm2)){
            if(username.equals("admin")){
                if(password.equals("123456")){
                    response.getWriter().println("登陆成功");
                }else{
                    response.getWriter().println("密码错误,请重新输入...");
                }
            }else{
                response.getWriter().println("用户名不存在...");
            }
        }else{
            response.getWriter().println("验证码错误,请重新输入...");
        }
    }
}

HTML页面:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script>
        function cleck() {
            var yzm = document.getElementById("yzm");
            var username = document.getElementById("username");
            if(yzm.value==''){
                alert("验证码不能为空,请输入验证码...")
            }else{
                if(username.value==''){
                    alert("用户名和密码不能为空...")
                }else {
                    //window.document.form1.action="test1";
                    window.document.form1.submit();
                }
            }
        }
    </script>

</head>
<body>
<div>
    <form method="post" name="form1" id="form1" action="test1">
        用户名:<input type="text" name="username" id="username" placeholder="请输入用户名">
        <br/>
        密&nbsp;&nbsp;&nbsp;码:<input type="password" name="password" id="password" placeholder="请输入密码">
        <br/>
        <img src="./yzm" id="tupian" height="30" onclick="this.src='./yzm?'+Math.random();" title="看不清?点击图片刷新"/>
        <br/>
        <input type="text" name="yzm" id="yzm" placeholder="验证码" style="width: 60px">
        <button type="button" onclick="tupian.src='./yzm?'+Math.random();">看不清楚,再来一张</button>
        <br/>
        <button type="button" onclick="cleck()">登录</button>
    </form>
</div>
</body>
</html>

生成随机验证码图片:

在servlet中实现对登录信息的验证:

HTML页面:

猜你喜欢