Javaweb中如何使用kaptcha给我们的页面加上验证码?

最新推荐文章于 2023-04-14 16:36:46 发布

潇洒不放纵的博客

最新推荐文章于 2023-04-14 16:36:46 发布

阅读量364

点赞数 21

分类专栏： java

本文链接：https://blog.csdn.net/lq1759336950/article/details/87459749

版权

java 专栏收录该内容

63 篇文章 3 订阅

订阅专栏

kaptcha是一个验证码生成库,通过在web.xml中进行配置,我们可以自己设置验证码大小,颜色,显示的字符等等.(注:框架中同样适用)
那么如何将其加载到我们的项目呢?步骤如下.
1.新建一个web项目,并将kaptcha-2.3.2.jar放在项目的WEB-INF/lib目录下,如图:
kaptcha-2.3.2.jar下载地址
链接:https://pan.baidu.com/s/1bFuqq5g9dB2Gxmx4upMb8A
提取码:bsxj
在这里插入图片描述
2.配置web.xml(此处仅配置了验证码的部分属性:长,高宽等,根据实际需要配置相应的属性)

    <web-app version="2.5" 
    	xmlns="http://java.sun.com/xml/ns/javaee" 
    	xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" 
    	xsi:schemaLocation="http://java.sun.com/xml/ns/javaee 
    	http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">
      <display-name></display-name>
      		<!--验证码配置-->
    <servlet>
            <!-- 生成图片的Servlet -->
           <servlet-name>Kaptcha</servlet-name>
             <servlet-class>com.google.code.kaptcha.servlet.KaptchaServlet</servlet-class>
                      <!-- 是否有边框-->
             <init-param>
                 <param-name>kaptcha.border</param-name>
                 <param-value>no</param-value>
             </init-param>    
             <!-- 字体颜色 -->
             <init-param>
                 <param-name>kaptcha.textproducer.font.color</param-name>
                 <param-value>blue</param-value>
             </init-param>
            <!-- 图片宽度 -->
             <init-param>
                 <param-name>kaptcha.image.width</param-name>
                 <param-value>135</param-value>
             </init-param>
             <!-- 使用哪些字符生成验证码 -->        
             <init-param>
                 <param-name>kaptcha.textproducer.char.string</param-name>
                 <param-value>ACDEFHKPRSTWX345679</param-value>
            </init-param>
             <!-- 图片高度 -->
             <init-param>
                 <param-name>kaptcha.image.height</param-name>
                 <param-value>50</param-value>
             </init-param>
             <!-- 字体大小 -->
             <init-param>
                 <param-name>kaptcha.textproducer.font.size</param-name>
                 <param-value>43</param-value>
             </init-param>
             <!-- 干扰线的颜色 -->
             <init-param>
                 <param-name>kaptcha.noise.color</param-name>
                 <param-value>black</param-value>
             </init-param>
             <!-- 字符个数 -->
             <init-param>
                 <param-name>kaptcha.textproducer.char.length</param-name>
                 <param-value>4</param-value>
             </init-param>
             <!-- 使用哪些字体 -->
             <init-param>
                 <param-name>kaptcha.textproducer.font.names</param-name>
                 <param-value>宋体</param-value>
             </init-param>        
         </servlet>
 <!-- 映射路径-->
   <servlet-mapping>
       <servlet-name>Kaptcha</servlet-name>
       <url-pattern>/kaptcha</url-pattern> 
   </servlet-mapping>

3:显示验证码
3.1前段代码(html)

<html>
  <head> 
    <title>My JSP 'index.jsp' starting page</title>
	<script type="text/javascript">
		function validateCode(){
		var result = true;
		var checkCode = document.getElementById("randNum");
		var checkCodeMsg = document.getElementById("errorMsg");
		if(checkCode.value == ""&&valiateUsrFlag&&valiatePwdFlag){
			checkCodeMsg.innerHTML = "验证码为必填项，请输入验证码";
			checkCodeMsg.className = 'n_zc_red';
			result = false;
			valiateCodeFlag=false;
		}else if(checkCode.value.length != 4&&valiateUsrFlag&&valiatePwdFlag){
			checkCodeMsg.innerHTML = "您输入的验证码有误，请重新输入";
			checkCodeMsg.className = 'n_zc_red';
			result = false;
			valiateCodeFlag=false;
		}else{
			valiateCodeFlag=true;
		}
		checkFormSuccess();
		return result;
	}
	
	function refreshCode(){
			var img = document.getElementById("img");
			if(img){
				nowDate = new Date();
				img.src = "${pageContext.request.contextPath}/kaptcha?d="+nowDate.getTime();
			}
		}
	</script>
  </head>
  
  <body>
    <form action="CheckServlet" method="post">
	<table>
		<td height="35">验证码：</td>
		<td width="54" height="35"><input type="text" name="randNum"
			id="randNum" class="input_38" onblur="validateCode()" tabindex="3" />
		</td>
		<td width="57" height="35"><img
			src="${pageContext.request.contextPath}/kaptcha" width="52"
			height="35" id="img" />
		</td>
		<td width="103" height="35"><a href="javascript:refreshCode();"
			class="color_57">看不清楚</a>
		</td>
	</table>
</form>
  </body>
</html>
3.2,后台servlet验证代码(请注意验证码中的大小写):
String randNum = request.getParameter("randNum");
	String check = request.getSession().getAttribute(com.google.code.kaptcha.Constants.KAPTCHA_SESSION_KEY)+"";
	check = check.trim();
	//判断输入的验证码是否与图片中的的相同
	if (!check.equals(randNum)) {
		//不同,输出no ,此处写自己的逻辑代码;
		System.out.println("no");
	} else {
	相同,输出yes,此处写自己的逻辑代码;
		System.out.println("yes");
		}

3.3运行结果
在这里插入图片描述

潇洒不放纵的博客

关注

21
点赞
踩
0

收藏

觉得还不错? 一键收藏
2
评论
Javaweb中如何使用kaptcha给我们的页面加上验证码?

kaptcha是一个验证码生成库,通过在web.xml中进行配置,我们可以自己设置验证码大小,颜色,显示的字符等等.那么如何将其加载到我们的项目呢?步骤如下.1.新建一个web项目,并将kaptcha-2.3.2.jar放在项目的WEB-INF/lib目录下,如图:2.配置web.xml(此处仅配置了验证码的部分属性:长,高宽等,根据实际需要配置相应的属性) &amp;lt;web-app ...
复制链接

扫一扫

专栏目录