点击切换验证码

最新推荐文章于 2022-12-30 21:46:05 发布

zalzal8898

最新推荐文章于 2022-12-30 21:46:05 发布

阅读量1.3k

点赞数

本文链接：https://blog.csdn.net/zal881124/article/details/108356523

版权

首先在web下新建一个login.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>登录</title>
		//实现验证码的点击切换
		<script type="text/javascript">
			//页面加载
			window.onload=function(){
			    document.getElementsByTagName("img")[0].onclick=function(){
			        this.src="/HttpServletResponse/VerifyCodeServlet?time="+new Date().getTime();//当鼠标单击时再次跳转到VerifyCodeServlet，生成新的验证码
				}
			}
		</script>

	</head>
<body>
	<form action="../UserServlet" method="post">
			用户名：<input type="text" name="username" /><br />
			密码：<input type="password" name="password" /><br />
			验证码：<input type="text" name="verifyCode" />
				<img src="/HttpServletResponse/VerifyCodeServlet">
			<br />//验证码的图片通过VerifyCodeServlet生成。
			<input type="submit" value="登录" />
	</form>
</body>
</html>

每次生成验证码，都是跳转到VerifyCodeServlet中生成，下面看一下其中的代码：

package com.itheima.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(name = "VerifyCodeServlet", urlPatterns = "/VerifyCodeServlet")
public class VerifyCodeServlet extends HttpServlet {
    public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException,
            IOException {
        response.setContentType("text/html;charset=utf-8");
        request.setCharacterEncoding("utf-8");
    // 使用java图形界面技术绘制一张图片

        int charNum = 4;//
        int width = 20 * 4;
        int height = 28;

        // 1. 创建一张内存图片
        BufferedImage bufferedImage = new BufferedImage(width, height, BufferedImage.TYPE_INT_RGB);

        // 2.获得绘图对象
        Graphics graphics = bufferedImage.getGraphics();

        // 3、绘制背景颜色
        graphics.setColor(Color.YELLOW);
        graphics.fillRect(0, 0, width, height);

        // 4、绘制图片边框
        graphics.setColor(Color.GRAY);
        graphics.drawRect(0, 0, width - 1, height - 1);

        // 5、输出验证码内容
        graphics.setColor(Color.RED);
        graphics.setFont(new Font("宋体", Font.BOLD, 22));

        // 随机输出4个字符
        String s = "ABCDEFGHGKLMNPQRSTUVWXYZ23456789";
        Random random = new Random();

        // session中要用到
        String msg = "";
        int x = 5;
        for (int i = 0; i < charNum; i++) {
            int index = random.nextInt(32);
            String content = String.valueOf(s.charAt(index));
            msg += content;
            graphics.setColor(new Color(random.nextInt(255), random.nextInt(255), random.nextInt(255)));
            graphics.drawString(content, x, 22);
            x += 20;
        }

        // 6、绘制干扰线
        graphics.setColor(Color.GRAY);
        for (int i = 0; i < 5; i++) {
            int x1 = random.nextInt(width);
            int x2 = random.nextInt(width);

            int y1 = random.nextInt(height);
            int y2 = random.nextInt(height);
            graphics.drawLine(x1, y1, x2, y2);
        }

        // 释放资源
        graphics.dispose();

        // 图片输出 ImageIO
        ImageIO.write(bufferedImage, "jpg", response.getOutputStream());
    }

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

}

zalzal8898

关注

0
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
点击切换验证码

首先在web下新建一个login.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> <he
复制链接

扫一扫