Html + Java登录验证码实现代码
前端:<div class="form-group"><label>验证码</label><div class="verify"><input class="form-control" style="width: 240px; display: inline-block;
·
前端:
<div class="form-group">
<label>验证码</label>
<div class="verify">
<input class="form-control" style="width: 240px; display: inline-block;" name="check" type="text" placeholder="请输入验证码" autocomplete="off">
<span><img src="../checkCode/showCode" alt="" onclick="changeCheckCode(this)"></span>
<script type="text/javascript">
//图片点击事件
function changeCheckCode(img) {
img.src="checkCode?"+new Date().getTime();
}
</script>
</div>
</div>
后端代码:
package com.hkd.controller;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import javax.imageio.ImageIO;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;
import java.awt.*;
import java.awt.image.BufferedImage;
import java.io.IOException;
import java.util.Random;
@Controller
@ResponseBody
@RequestMapping("/checkCode")
public class CheckCode {
@RequestMapping("/showCode")
public void showCode(HttpSession session, HttpServletRequest request, HttpServletResponse response) throws IOException {
//服务器通知浏览器不要缓存
response.setHeader("pragma", "no-cache");
response.setHeader("cache-control", "no-cache");
response.setHeader("expires", "0");
//在内存中创建一个长80,宽30的图片,默认黑色背景
//参数一:长
//参数二:宽
//参数三:颜色
int width = 80;
int height = 30;
BufferedImage image = new BufferedImage(width, height, BufferedImage.TYPE_INT_RGB);
//获取画笔
Graphics g = image.getGraphics();
//设置画笔颜色为灰色
g.setColor(Color.GRAY);
//填充图片
g.fillRect(0, 0, width, height);
//产生4个随机验证码,12Ey
String checkCode = getCheckCode();
//将验证码放入HttpSession中
session.setAttribute("CHECKCODE_SERVER", checkCode);
//设置画笔颜色为黄色
g.setColor(Color.YELLOW);
//设置字体的小大
g.setFont(new Font("黑体", Font.BOLD, 24));
//向图片上写入验证码
g.drawString(checkCode, 15, 25);
//将内存中的图片输出到浏览器
//参数一:图片对象
//参数二:图片的格式,如PNG,JPG,GIF
//参数三:图片输出到哪里去
ImageIO.write(image, "PNG", response.getOutputStream());
}
private String getCheckCode() {
String base = "0123456789ABCDEFGabcdefg";
int size = base.length();
Random r = new Random();
StringBuffer sb = new StringBuffer();
for (int i = 1; i <= 4; i++) {
//产生0到size-1的随机值
int index = r.nextInt(size);
//在base字符串中获取下标为index的字符
char c = base.charAt(index);
//将c放入到StringBuffer中去
sb.append(c);
}
return sb.toString();
}
}
后端校验验证码代码:
// 校验验证码
String checkcode_server = (String) session.getAttribute("CHECKCODE_SERVER");
session.removeAttribute("CHECKCODE_SERVER"); // 为了保证验证码只能使用一次
if (checkcode_server == null || !checkcode_server.equalsIgnoreCase(check)) {
map.put("code", 1000);
map.put("msg", "验证码错误,请刷新验证码后重新输入");
return map;
}
// 校验验证码结束
效果:
使用的是SSM-plus框架,基本上是通用的代码。
更多推荐
所有评论(0)