大家好,又见面了,我是你们的朋友全栈君。
首先引入依赖:
<!--kaptcha验证码插件-->
<dependency>
<groupId>com.github.penggle</groupId>
<artifactId>kaptcha</artifactId>
<version>2.3.2</version>
</dependency>
接下来
import javax.servlet.http.HttpServletRequest;
public class CodeUtil {
public static boolean checkVerifyCode(HttpServletRequest request) {
//验证码图片字符串
String verifyCodeExpected = (String)request.getSession().getAttribute(com.google.code.kaptcha.Constants.KAPTCHA_SESSION_KEY);
/** *验证码框内字符串,j_captcha为login.jsp上验证码框input的name, *除了这个需要改换成自己的name,其他可以直接套用 *HttpServletRequestUtil是一个工具类 */
String verifyCodeActual = HttpServletRequestUtil.getString(request, "j_captcha");
if(verifyCodeActual == null || !verifyCodeActual.equals(verifyCodeExpected)) {
return false;
}
return true;
}
}
import javax.servlet.http.HttpServletRequest;
public class HttpServletRequestUtil {
public static int getInt(HttpServletRequest request, String name) {
try {
return Integer.decode(request.getParameter(name));
} catch (Exception e) {
return -1;
}
}
public static long getLong(HttpServletRequest request, String name) {
try {
return Long.valueOf(request.getParameter(name));
} catch (Exception e) {
return -1;
}
}
public static Double getDouble(HttpServletRequest request, String name) {
try {
return Double.valueOf(request.getParameter(name));
} catch (Exception e) {
return -1d;
}
}
public static Boolean getBoolean(HttpServletRequest request, String name) {
try {
return Boolean.valueOf(request.getParameter(name));
} catch (Exception e) {
return false;
}
}
public static String getString(HttpServletRequest request, String name) {
try {
String result = request.getParameter(name);
if (result != null) {
result = result.trim();
}
if ("".equals(result))
result = null;
return result;
} catch (Exception e) {
return null;
}
}
}
if(!CodeUtil.checkVerifyCode(request)) {
msg = "验证码错误";
//验证码为空或验证码错误返回字段,可以自己在登陆jsp界面增加验证码框内不为空的错误显示
}else {
return "redirect:/testuser/main";
//验证通过,重定向到用户主页,可以换成自己的指向用户主页方式
}
//验证码框和验证码图片的代码,直接插入到登陆的验证表单里也就是用户名和密码下面
<div class="item-inner">
<label for="j_captcha" class="item-title label">验证码</label>
<input id="j_captcha" name="j_captcha" type="text" class="form-control in" placeholder="验证码" />
<div class="item-input">
<img id="captcha_img" alt="点击更换" title="点击更换" onclick="changeVerifyCode(this)" src="../Kaptcha" />
/**这里的src值需与web.xml里设置的kaptcha设置里的url-pattern * 相同,可以不用改动直接用,前提是文件结构如下图 */
</div>
</div>
//这个可以直接套用,jquery对象依照上面进行设置
<script>
$('#submit').click (
function() {
var formData = new FormData();
var verifyCodeActual = $('#j_captcha').val();
//点击提交时,判断验证码是否为空,如果为空,提示输入验证码
if (!verifyCodeActual) {
alert('请输入验证码');
return;
}
//如果不为空,将验证码塞进formData里面去
formData.append('verifyCodeActual', verifyCodeActual);
//不管提交成功与否,验证码都会更换
$('#captcha_img').click();
});
function changeVerifyCode(img) {
img.src = "../Kaptcha?" + Math.floor(Math.random() * 100);
/*利用随机数进行验证码图片替换,这里的src也是要与web.xml里的一致, 要改动的话一起改 */
}
</script>
<!-- 验证码相关属性的配置 -->
<servlet>
<servlet-name>Kaptcha</servlet-name>
<servlet-class>com.google.code.kaptcha.servlet.KaptchaServlet</servlet-class>
<!-- 定义 Kaptcha 的样式 -->
<!-- 是否有边框 -->
<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>red</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.image.height</param-name>
<param-value>50</param-value>
</init-param>
<!-- 使用哪些字符生成验证码 -->
<init-param>
<param-name>kaptcha.textproducer.char.string</param-name>
<param-value>ACDEFHKPRSTWX345975</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>Arial</param-value>
</init-param>
</servlet>
<servlet-mapping>
<servlet-name>Kaptcha</servlet-name>
<!-- 外部访问路径 就是这里,需要改动jsp里src值的话这里也要改-->
<url-pattern>/Kaptcha</url-pattern>
</servlet-mapping>
只要更改以上五项就能实现,其中新建CodeUtil静态类和HttpServletRequestUtil工具类
发布者:全栈程序员栈长,转载请注明出处:https://javaforall.cn/150688.html原文链接:https://javaforall.cn