网页验证码

学习使用开源工具制作网页验证码

开发工具:eclipse、kaptcha-2.3.jar包。

一、创建Web项目;

二、新建一个Jsp页面(内容有,一个文本框,一个图片容器,一个提交按钮)

<body>
	<img alt="random" src="randomcode.jpg" οnclick="changeR(this)" style="cursor: pointer;">
	<form action="check.jsp">    
		<input type="text" name="r">
		<input type="submit" value="s">
	</form>
</body>	

三、可以看出图片验证码来源(src=“randomcode.jpg”)需配置Web.xml文件。(交给Servlet(该servlet在kaptcha-2.3.jar)处理)

  <servlet>
  	<servlet-name>Kaptcha</servlet-name>   
  	<servlet-class>com.google.code.kaptcha.servlet.KaptchaServlet</servlet-class>  
  </servlet>
  <servlet-mapping>
  	<servlet-name>Kaptcha</servlet-name>
  	<url-pattern>/randomcode.jpg</url-pattern>
  </servlet-mapping>


四、由于需要kaptcha-2.3.jar包,所以将下载好的jar包导入在lib中。(复制黏贴即可)

其他:

一、网页验证码的属性

(一)添加边框
<servlet> 
	<init-param>
		<description>图片边框,合法值:yes , no</description>
		<param-name>kaptcha.border</param-name>
		<param-value>yes</param-value>  <!-- yes 或者 no-->
	</init-param>

</servlet>
(二)边框颜色
	<init-param>
		<description>
			边框颜色,合法值: r,g,b (and optional alpha) 或者white,black,blue.
		</description>
		<param-name>kaptcha.border.color</param-name>
		<param-value>black</param-value>
	</init-param>
(三)边框厚度
	<init-param>
		<description>边框厚度,合法值:>大于0 </description>
		<param-name>kaptcha.border.thickness</param-name>
		<param-value>1</param-value>
	</init-param>
(四)图片宽度
	<init-param>
		<description>图片宽 200</description>
		<param-name>kaptcha.image.width</param-name>
		<param-value>200</param-value>
	</init-param>
(五)图片高度
	<init-param>
		<description>图片高 50</description>
		<param-name>kaptcha.image.height</param-name>
		<param-value>50</param-value>
	</init-param>
(六)验证码集合
	<init-param>
		<description>文本集合,验证码值从此集合中获取</description>
		<param-name>kaptcha.textproducer.char.string</param-name>
		<param-value>1234567890</param-value>              <!--纯数字 -->
		//<param-value>abcde2345678gfynmnpwx</param-value>  <!-- 文字加英文-->
	</init-param>
(七)验证码长度
	<init-param>
		<description>验证码长度 默认是5 </description>
		<param-name>kaptcha.textproducer.char.length</param-name>
		<param-value>2</param-value>
	</init-param>
(八)字体
	<init-param>
		<description>字体 Arial, Courier</description>
		<param-name>kaptcha.textproducer.font.names</param-name>
		<param-value>Arial, Courier</param-value>
	</init-param>
(九)字体大小
	<init-param>
		<description>字体大小 40px.</description>
		<param-name>kaptcha.textproducer.font.size</param-name>
		<param-value>40</param-value>
	</init-param>
(十)字体颜色
	<init-param>
		<description>
			字体颜色,合法值: r,g,b 或者 white,black,blue.
		</description>
		<param-name>kaptcha.textproducer.font.color</param-name>
		<param-value>black</param-value>
	</init-param>
(十一)每个验证码之间的间隔
	<init-param>
		<description>文字间隔 2</description>
		<param-name>kaptcha.textproducer.char.space</param-name>
		<param-value>2</param-value>
	</init-param>
(十二)干扰实现
	<init-param>
		<description>干扰实现类</description>
		<param-name>kaptcha.noise.impl</param-name>
		<param-value>
			<!-- com.google.code.kaptcha.impl.NoNoise -->
			com.google.code.kaptcha.impl.DefaultNoise
		</param-value>
	</init-param>
(十三)干扰颜色
	<init-param>
		<description>
			干扰颜色,合法值: r,g,b 或者 white,black,blue.
		</description>
		<param-name>kaptcha.noise.color</param-name>
		<param-value>black</param-value>
	</init-param>
(十四)背景样式
	<init-param>
		<description>
			图片样式: 水纹com.google.code.kaptcha.impl.WaterRipple
			鱼眼com.google.code.kaptcha.impl.FishEyeGimpy
			阴影com.google.code.kaptcha.impl.ShadowGimpy
		</description>
		<param-name>kaptcha.obscurificator.impl</param-name>
		<param-value>
			com.google.code.kaptcha.impl.WaterRipple
		</param-value>
	</init-param>
(十五)背景实现类
	<init-param>
		<description>背景实现类</description>
		<param-name>kaptcha.background.impl</param-name>
		<param-value>
			com.google.code.kaptcha.impl.DefaultBackground
		</param-value>
	</init-param>
(十六)背景渐变颜色
	<init-param>
		<description>背景颜色渐变,开始颜色</description>
		<param-name>kaptcha.background.clear.from</param-name>
		<param-value>green</param-value>
	</init-param>
	<init-param>
		<description>背景颜色渐变,结束颜色</description>
		<param-name>kaptcha.background.clear.to</param-name>
		<param-value>white</param-value>
	</init-param>
(十七)文字渲染器
	<init-param>
		<description> 文字渲染器 </description>
		<param-name>kaptcha.word.impl</param-name>
		<param-value>
			com.google.code.kaptcha.text.impl.DefaultWordRenderer
		</param-value>
	</init-param>
(十八)图片的验证码会保存在Session中,其中的值为

	<init-param>
		<description>	session中存放验证码的key键   </description>
		<param-name>kaptcha.session.key</param-name>
		<param-value>KAPTCHA_SESSION_KEY</param-value>
	</init-param>

(十九)图片实现类别

	<init-param>
		<description>图片实现类</description>
		<param-name>kaptcha.producer.impl</param-name>
		<param-value>
			com.google.code.kaptcha.impl.DefaultKaptcha
		</param-value>
	</init-param>

(二十)文本实现类(可通过重写该类来实现验证码为中文)
	<init-param>
		<description>文本实现类</description>
		<param-name>kaptcha.textproducer.impl</param-name>
		<param-value>
			com.google.code.kaptcha.text.impl.DefaultTextCreator
		</param-value>
	</init-param>

重写文本实现类,实现验证码为中文:

1.创建一个类别,继承Configurable  实现TextProducer(在jar包中)

import com.google.code.kaptcha.text.TextProducer;
import com.google.code.kaptcha.util.Configurable;
import java.util.Random;
public class ChineseText extends Configurable implements TextProducer {

	public String getText() {
		int length = getConfig().getTextProducerCharLength();
		String finalWord = "", firstWord = "";
		int tempInt = 0;
		String[] array = { "0", "1", "2", "3", "4", "5", "6", "7", "8", "9",
				"a", "b", "c", "d", "e", "f" };

		Random rand = new Random();

		for (int i = 0; i < length; i++) {
			switch (rand.nextInt(array.length)) {
			case 1:
				tempInt = rand.nextInt(26) + 65;
				firstWord = String.valueOf((char) tempInt);
				break;
			case 2:
				int r1,
				r2,
				r3,
				r4;
				String strH,
				strL;// high&low
				r1 = rand.nextInt(3) + 11; // 前闭后开[11,14)
				if (r1 == 13) {
					r2 = rand.nextInt(7);
				} else {
					r2 = rand.nextInt(16);
				}

				r3 = rand.nextInt(6) + 10;
				if (r3 == 10) {
					r4 = rand.nextInt(15) + 1;
				} else if (r3 == 15) {
					r4 = rand.nextInt(15);
				} else {
					r4 = rand.nextInt(16);
				}

				strH = array[r1] + array[r2];
				strL = array[r3] + array[r4];

				byte[] bytes = new byte[2];
				bytes[0] = (byte) (Integer.parseInt(strH, 16));
				bytes[1] = (byte) (Integer.parseInt(strL, 16));

				firstWord = new String(bytes);
				break;
			default:
				tempInt = rand.nextInt(10) + 48;
				firstWord = String.valueOf((char) tempInt);
				break;
			}
			finalWord += firstWord;
		}
		return finalWord;
	}
}

2.修改Web.xml配置

	<init-param>
		<description>文本实现类</description>
		<param-name>kaptcha.textproducer.impl</param-name>
		<param-value>
			ChineseText
		</param-value>
	</init-param>

五、验证码的校验(本文是利用check.jsp来校验的)保存在Session中,其中的键值为(第十八个属性)

<body>
	<%
	// 检查是否是正确的验证码
		String k = (String) session.getAttribute(com.google.code.kaptcha.Constants.KAPTCHA_SESSION_KEY);
		String str = request.getParameter("r");
		if (k.equals(str))
			out.print("true");
		out.print(k + "---" + str);
	%>
</body>

六、扩展(加法验证码的实现)

1.重写KaptchaServlet类


import com.google.code.kaptcha.Producer;
import com.google.code.kaptcha.util.Config;
import java.awt.image.BufferedImage;
import java.io.IOException;
import java.util.Enumeration;
import java.util.Properties;
import javax.imageio.ImageIO;
import javax.servlet.Servlet;
import javax.servlet.ServletConfig;
import javax.servlet.ServletException;
import javax.servlet.ServletOutputStream;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;

public class KaptchaServlet extends HttpServlet implements Servlet {
	private Properties props;
	private Producer kaptchaProducer;
	private String sessionKeyValue;

	public KaptchaServlet() {
		this.props = new Properties();

		this.kaptchaProducer = null;

		this.sessionKeyValue = null;
	}

	public void init(ServletConfig conf) throws ServletException {
		super.init(conf);

		ImageIO.setUseCache(false);

		Enumeration initParams = conf.getInitParameterNames();
		while (initParams.hasMoreElements()) {
			String key = (String) initParams.nextElement();
			String value = conf.getInitParameter(key);
			this.props.put(key, value);
		}

		Config config = new Config(this.props);
		this.kaptchaProducer = config.getProducerImpl();
		this.sessionKeyValue = config.getSessionKey();
	}

	public void doGet(HttpServletRequest req, HttpServletResponse resp)
			throws ServletException, IOException {
		resp.setDateHeader("Expires", 0L);

		resp.setHeader("Cache-Control", "no-store, no-cache, must-revalidate");

		resp.addHeader("Cache-Control", "post-check=0, pre-check=0");

		resp.setHeader("Pragma", "no-cache");

		resp.setContentType("image/jpeg");

		String capText = this.kaptchaProducer.createText();
		String s1 = capText.substring(0, 1);
		String s2 = capText.substring(1, 2);
		int r = Integer.valueOf(s1).intValue() + Integer.valueOf(s2).intValue();

		req.getSession().setAttribute(this.sessionKeyValue, String.valueOf(r));

		BufferedImage bi = this.kaptchaProducer.createImage(s1+"+"+s2+"=?");

		ServletOutputStream out = resp.getOutputStream();

		ImageIO.write(bi, "jpg", out);
		try {
			out.flush();
		} finally {
			out.close();
		}
	}
}

2.修改配置文件

<servlet>
  	<servlet-name>Kaptcha</servlet-name>
  	<servlet-class>KaptchaServlet</servlet-class>
</servlet>

(注:本文是通过在慕课网学习之后的博客笔记,资源以及资料的下载也从该网站中下载而来)

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值