登录之验证码

       产生验证码,MakeCertPic.java:

public class MakeCertPic {
	
	// 验证码图片中可以出现的字符集,可根据需要修改
	private char mapTable[] = 
		{ 'a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i',
		  'j', 'k', 'l', 'm', 'n', 'o', 'p', 'q', 'r', 's', 't', 'u', 'v',
		  'w', 'x', 'y', 'z', '0', '1', '2', '3', '4', '5', '6', '7', '8',
		  '9' };

	/**
	 * 功能:生成彩色验证码图片 参数width为生成图片的宽度,参数height为生成图片的高度,参数os为页面的输出流
	 * 在getCertPic()方法中,首先创建了一个内存图像的实例对象,再得到此内存图像的图形上下文对象,
	 * 接着再用这个上下文对象画背景、边框。接下来,随机生成4个在mapTable[]数组中的字符,组成字符串作为验证字符串,
	 * 并输出在内存中,为了造成一定的干扰,随机画了10个干扰点,如果要加大干扰效果,可再多画一些点。
	 */
	public String getCertPic(int width, int height, OutputStream os) {
		if (width <= 0)
			width = 60;
		if (height <= 0)
			height = 20;
		BufferedImage image = new BufferedImage(width, height, BufferedImage.TYPE_INT_RGB);
		// 获取图形上下文
		Graphics g = image.getGraphics();
		// 设定背景色
		g.setColor(new Color(0xDCDCDC));
		g.fillRect(0, 0, width, height);
		// 画边框
		g.setColor(Color.black);
		g.drawRect(0, 0, width - 1, height - 1);
		// 取随机产生的认证码
		String strEnsure = "";
		// 4代表4位验证码,如果要生成更多位的认证码,则加大数值
		for (int i = 0; i < 4; ++i) {
			strEnsure += mapTable[(int) (mapTable.length * Math.random())];
		}
		// 将认证码显示到图像中,如果要生成更多位的认证码,增加drawString语句
		g.setColor(Color.black);
		g.setFont(new Font("Atlantic Inline", Font.PLAIN, 18));
		String str = strEnsure.substring(0, 1);
		g.drawString(str, 8, 17);
		str = strEnsure.substring(1, 2);
		g.drawString(str, 20, 15);
		str = strEnsure.substring(2, 3);
		g.drawString(str, 35, 18);
		str = strEnsure.substring(3, 4);
		g.drawString(str, 45, 15);
		// 随机产生10个干扰点
		Random rand = new Random();
		for (int i = 0; i < 10; i++) {
			int x = rand.nextInt(width);
			int y = rand.nextInt(height);
			g.drawOval(x, y, 1, 1);
		}
		// 释放图形上下文
		g.dispose();
		try {
			// 输出图像到页面
			ImageIO.write(image, "JPEG", os);
		} catch (IOException e) {
			return "";
		}
		return strEnsure;
	}
}

       生成图片,makeCertPic.jsp

<%@page contentType="image/jpeg;charset=UTF-8"%>
<jsp:useBean id="image" scope="page" class="com.online.util.MakeCertPic" />
<!-- 这里把生成的验证码作为session变量写入,因此在接收登录页面输入的数据页面中,
	 可用用户输入的验证码和这个session变量作比较,如果相同则表示验证通过。 -->
<%
	String str = image.getCertPic(0, 0, response.getOutputStream());
	// 将认证码存入SESSION
	session.setAttribute("certCode", str);  
	out.clear();
	out = pageContext.pushBody();
%>

       登录页面或者其它页面得到验证码:

<img src="makeCertPic.jsp" id="code" onclick="reloadcode()" style="cursor: pointer;" alt="看不清楚,换一张" />

       刷新验证码:

function reloadcode(){
  var verify = document.getElementById('code');
  verify.setAttribute('src', 'makeCertPic.jsp?it='+Math.random());
}

       这里的makeCertPic.jsp路径需要按照自己项目情况重新处理,现在很多网站都对登录时的验证码做这样处理,为了好的用户体验,前3次登录不需要输入验证码,如果3次全输入错误,第4次登录,就会需要输入验证码,这样做的好处是,既有好的用户体验又可以防止暴力破解。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏WebDeveloper

css的高级用法

14430
来自专栏debugeeker的专栏

《coredump问题原理探究》windows版6.2节有成员变量的类

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/xuzhina/article/detai...

7710
来自专栏小樱的经验随笔

简易版DES加密和解密详解

在DES密码里,是如何进行加密和解密的呢?这里采用DES的简易版来进行说明。 二进制数据的变换 由于不仅仅是DES密码,在其它的现代密码中也应用了二进制数据,所...

37060
来自专栏Fish

蓝桥杯 危险系数

题意就是求图中两点之间的割点的数目。 不知道被谁指导的说求割点可以用tarjan算法,就用了tarjan算法,但是tarjan算法求的是整个图的割点个数啊,至于...

22580
来自专栏为数不多的Android技巧

ASCII Art:使用纯文本流程图

我们使用纯文本写代码,有了Markdown又可以使用纯文本写文档,那么对于更直观的信息表达方式——图片,能不能使用纯文本描述呢?

37820
来自专栏数据小魔方

动态图表系列2|数据有效性+OFFSET函数

今天跟大家分享的是动态图表系列2——数据有效性+OFFSET函数! 数据有效性可以与不同类型查询函数组合,形成动态数据源,今天我们来看一下它与OFFSET函数的...

30480
来自专栏生信宝典

R语言学习 - 箱线图一步法

箱线图 - 一步绘制 绘图时通常会碰到两个头疼的问题: 有时需要绘制很多的图,唯一的不同就是输入文件,其它都不需要修改。如果用R脚本,需要反复替换文件名,繁琐又...

37750
来自专栏游戏杂谈

TexturePacker压缩png的命令

压缩png效果最好的当然是TinyPNG这种神器了,不过一般情况下TexturePacker压缩出来的也基本上能达到效果。

30420
来自专栏点滴积累

geotrellis使用(二十八)栅格数据色彩渲染(多波段真彩色)

目录 前言 实现过程 总结 一、前言        上一篇文章介绍了如何使用Geotrellis渲染单波段的栅格数据,已然很是头疼,这几天不懈努力之后工作又进了...

37650
来自专栏IT开发技术与工作效率

dot 语言画类图和 UML 关系环境变量与命令行VSCode (实时预览编辑器)类图一对多多对多UML(统一建模语言)关系其他学习链接

87160

扫码关注云+社区

领取腾讯云代金券