在JSP页面中画出一个验证码_jsp绘制验证码-CSDN博客

本文链接：https://blog.csdn.net/Ataraxia_Y/article/details/82844481

一、瞎扯

我们在日常的注册页面，在登录界面会看到有验证码，当然看到这个是非常头疼的，但是今天我们就来做这个东西。

二、准备

一台装有eclipse的电脑

三、步骤

1、我们先创建一个画布

2、我们通过画布然后创建出一个画笔

3、我们设置画笔的颜色

4、我们给我们的画布填充颜色

5、随机生成字符串

6、设置字体颜色，字体的样式（是否加粗呀，是否倾斜啊。。。），然后就开始画了

7、来几条干扰线，更具朦胧感

8、压缩图片并发送回浏览器

四、开始

第一步，咱们这样

package com.yd.util;

import java.awt.Color;
import java.awt.Font;
import java.awt.Graphics;
import java.awt.image.BufferedImage;
import java.util.HashMap;
import java.util.Map;
import java.util.Random;

public class ValidateCode {
	public Map<String,Object> getImage(){
		//1、创建画板
		BufferedImage image = new BufferedImage(100, 30, BufferedImage.TYPE_INT_RGB);
		//2、创建画笔
		Graphics g = image.getGraphics();
		//3、设置画笔的颜色
		Random r = new Random();
		g.setColor(new Color(r.nextInt(255), r.nextInt(255), r.nextInt(255)));
		//4、填充画板
		g.fillRect(0, 0, 100, 30);
		//5、绘制随机字符
		String num = getChara(4);
		//6、修改颜色设置字体绘制
		g.setColor(new Color(0, 0, 0));
		g.setFont(new Font(null, Font.BOLD, 25));
		g.drawString(num, 20, 25);
		//7、绘制干扰线
		for(int i = 0 ;i < 10;i++){
			g.setColor(new Color(r.nextInt(255), r.nextInt(255), r.nextInt(255)));
			g.drawLine(r.nextInt(100), r.nextInt(30), r.nextInt(100), r.nextInt(30));
		}
		Map<String,Object> map = new HashMap<>();
		map.put("image", image);
		map.put("chara", num);
		return map;
	}
	public String getChara(int size){
		String chara = "abcdefghijklmnopqrstuvwxyz123456789ABCDEFGHIJKLMNOPQRSTUVWXYZ";
		Random r = new Random();
		StringBuffer sb = new StringBuffer();
		for(int i = 0;i<size;i++){
			sb.append(chara.charAt(r.nextInt(chara.length())));
		}
		return sb.toString();
	}
}

第二步，在jsp页面中画出表单

<form action="action.jsp" method="post">
		<table>
			<tr>
				<td>用户名：</td>
				<td><input type="text" name="name"/></td>
				<td></td>
			</tr>
			<tr>
				<td>密&nbsp;&nbsp;码:</td>
				<td><input type="password" name="pwd"/></td>
				<td></td>
			</tr>
			<tr>
				<td>验证码:</td>
				<td><input type="text" name="validate"/></td>
				<td><img src="validateCode.jsp" onclick="this.src=this.src+'?'+new Date().valueOf();" style="width='100px' height='30px' border:1px solid black"/></td>
			</tr>
			<tr>
				<td></td>
				<td colspan="2">
					<input type="submit" value="提交">
				</td>
			</tr>
		</table>
	</form>
	<div>
		<%
			if(session.getAttribute("errorMessage")==null){
				
			}else{
				out.print(session.getAttribute("errorMessage"));
			}
			
		%>
	</div>

第三步，我们在另一个页面写出处理的压缩图片并发送回客户端

<body>
	<%
		//设置响应的数据类型
		response.setContentType("image/jpeg");
		//获取到返回的集合
		Map<String,Object> map = new ValidateCode().getImage();
		ImageIO.write((BufferedImage)(map.get("image")),"jpeg", response.getOutputStream());
		out.clear();
		out = pageContext.pushBody();
		session.setAttribute("code", (String)map.get("chara"));
	%>
</body>

五、结果就是这样