登录验证码是怎么来的?

一个可提供登录验证码的Web Project。


前言

开发环境: Eclipse IDE for Enterprise Version: 2020-06
这是一个Web Project


一、类图

在这里插入图片描述

二、主要代码段

1.IdentityServlet

类的源码如下:

public class IdentityServlet extends HttpServlet {
	public static final char[] CHARS = { '2', '3', '4', '5', '6', '7', '8', '9', 'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H',
			'J', 'K', 'L', 'M', 'N', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z' }; // 随机字符字典,不包括0,O、1、I等等难辨认的字符。

	public static Random random = new Random(); // 随机数

	public static String getRandomString() { // 获取6位随机数
		StringBuffer buffer = new StringBuffer(); /* 字符串缓冲 */
		for (int i = 0; i < 6; i++) { // 循环6次
			buffer.append(CHARS[random.nextInt(CHARS.length)]); // 每次取一个随机字符
		}
		return buffer.toString();
	}

	public static Color getRandomColor() {
		// 获取随机的颜色
		return new Color(random.nextInt(255), random.nextInt(255), random.nextInt(255));
	}

	public static Color getReverseColor(Color c) { // 返回某颜色的反色
		return new Color(255 - c.getRed(), 255 - c.getGreen(), 255 - c.getBlue());
	}

	public void doGet(HttpServletRequest request, HttpServletResponse response) throws IOException {
		response.setContentType("image/jpge"); // 设置输出类型,必须的

		String randomString = getRandomString(); // 随机字符串

		request.getSession(true).setAttribute("randomString", randomString); // 放到session中

		int width = 200; // 图片宽度
		int height = 35; // 图片高度

		Color bgColor = getRandomColor(); // 随机颜色,用于背景色。
		Color reverse = getReverseColor(bgColor); // 反色,用于前景色

		BufferedImage bi = new BufferedImage(width, height, BufferedImage.TYPE_INT_RGB); // 创建一个彩色图片

		Graphics2D g = bi.createGraphics(); // 获取绘图对象。

		// 开始绘图
		g.setColor(bgColor); // 设置背景色
		g.setFont(new Font("宋体", Font.BOLD, 16));
		g.fillRect(0, 0, width, height); // 填充背景色。

		g.setColor(reverse); // 设置前景色
		g.drawString(randomString, 70, 23); // 绘制随机字符

		for (int i = 0, n = random.nextInt(100); i < n; i++) {

			g.drawRect(random.nextInt(width), random.nextInt(height), 1, 1); // 绘制字符串区域的随机噪音点。
		}

		ServletOutputStream out = response.getOutputStream();
		JPEGImageEncoder encoder = JPEGCodec.createJPEGEncoder(out); // 专成JPEG编码格式

		encoder.encode(bi); // 对图片进行编码
		out.flush(); // 输出到客户端。

	}
}

2.identity.html

页面源码如下:


<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
	function reloadImage() {

		document.getElementById('btn').disabled = true;
		document.getElementById('identity').src = 'identityServlet?ts='
				+ new Date().getTime();
	}
</script>

</head>
<body>
	<img src="identityServlet" id="identity" onLoad="btn.disabled = false"
		style="vertical-align: middle" />
	<input type=button value="换个图片" onclick="reloadImage()" id="btn" />
</body>
</html>

3.web.xml

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
	xmlns="http://java.sun.com/xml/ns/javaee"
	xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd"
	id="WebApp_ID" version="3.0">
	<display-name>GetLocation</display-name>
	<welcome-file-list>
		<welcome-file>identity.html</welcome-file>
	</welcome-file-list>
	<servlet>
		<servlet-name>IdentityServlet</servlet-name>
		<servlet-class>IdentityServlet</servlet-class>
		<init-param>
			<param-name>encoding</param-name>
			<param-value>utf-8</param-value>
		</init-param>
		<load-on-startup>1</load-on-startup>		<!-- 第一次请求后,才加载该servlet -->
	</servlet>
	<servlet-mapping>
		<servlet-name>IdentityServlet</servlet-name>
		<url-pattern>/identityServlet</url-pattern>
	</servlet-mapping>
</web-app>

三、测试结果

在这里插入图片描述

总结

在firefox中,按下"F12" -->选择"调试器" --> 可对源码设置端点,以便调试。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值