Java实现滑动验证码的示例代码
更新时间:2022年02月28日 15:52:46 作者:灰太狼_cxh
这篇文章主要为大家介绍了如何用Java语言实现滑动验证码的生成,项目采用了springboot,maven等技术,感兴趣的小伙伴可以跟随小编学习一下
功能:java实现滑动验证码
项目是采用springboot,maven
开发工具:采用idea
1.效果演示
2.后端代码
控制层
@Controller public class SliderCodeController { @Autowired ResourceLoader resourceLoader; @Autowired private FileUtil fileUtil; // 设置横轴位置缓存 public static Cache< String, Integer > cacheg = CacheBuilder.newBuilder().expireAfterWrite(60, TimeUnit.SECONDS) .maximumSize(666666).build(); @GetMapping @RequestMapping("index") public String test(HttpServletRequest request, Model model) throws IOException { return "index"; } @GetMapping @RequestMapping("getImg") public @ResponseBody Map< String, Object > getPic(HttpServletRequest request) throws IOException { try { File targetFile = fileUtil.getFile("target"); File tempImgFile = fileUtil.getFile("temp"); Map < String, Object > resultMap = VerifyImageUtil.pictureTemplatesCut(tempImgFile, targetFile); // 生成流水号,这里就使用时间戳代替 String lno = Calendar.getInstance().getTimeInMillis() + ""; cacheg.put(lno, Integer.valueOf(resultMap.get("xWidth") + "")); resultMap.put("capcode", lno); // 移除横坐标送前端 resultMap.remove("xWidth"); return resultMap; } catch (Exception e) { e.printStackTrace(); return null; } } @GetMapping @RequestMapping("checkImgCode") public @ResponseBody Map < String, Object > checkcapcode(@RequestParam("xpos") int xpos, @RequestParam("capcode") String capcode, HttpServletRequest request) throws IOException { Map < String, Object > result = new HashMap< String, Object >(); Integer x = cacheg.getIfPresent(capcode); if (x == null) { // 超时 result.put("code", 3); } else if (xpos - x > 5 || xpos - x < -5) { // 验证失败 result.put("code", 2); } else { // 验证成功 result.put("code", 1); } return result; } }
工具类
@Component public class FileUtil { @Value("${file.path}") private String filePath; @Value("${file.target.path}") private String targetFilePath; @Value("${file.target.num}") private Integer targetfileNum; @Value("${file.temp.path}") private String tempFilePath; @Value("${file.temp.num}") private Integer tempfileNum; public File getFile(String type){ int num = 0; String imgType = ".jpg"; String oldFilePath = ""; if(type.equals("target")){ num = new Random().nextInt(targetfileNum) + 1; oldFilePath = targetFilePath; } else if(type.equals("temp")){ num = new Random().nextInt(tempfileNum) + 1; imgType = "-w.png"; oldFilePath = tempFilePath; } String path = filePath; String fileImg = num + imgType; String filePath = path + fileImg; File pathFile = new File(path); if(!pathFile.exists()){ pathFile.mkdirs(); } File file = new File(filePath); if(!file.exists()){ try { file.createNewFile(); ClassPathResource classPathResource = new ClassPathResource(oldFilePath + fileImg); InputStream inputStream = classPathResource.getInputStream(); if(inputStream.available() != 0){ FileUtils.copyInputStreamToFile(inputStream, file); } inputStream.close(); } catch (IOException e) { e.printStackTrace(); } } return file; } }
3.前端页面
<!DOCTYPE html> <html xmlns:th="http://www.thymeleaf.org"> <head> <meta charset="UTF-8"> <title>滑动验证码</title> <link rel="stylesheet" href="/css/slide.css" rel="external nofollow" > <script src="/js/jquery-1.11.1.min.js"></script> <script src="/js/jquery.lgyslide.js"></script> </head> <body> <div id="imgscode"></div> <script> $(function() { setTimeout(function() { createcode(); }, 1000) }()); //显示验证码 function createcode() { $ .ajax({ type : 'POST', url : '/getImg', dataType : 'json', success : function(data) { if (data != null) { $("#imgscode") .imgcode( { frontimg : 'data:image/png;base64,' + data.slidingImage, backimg : 'data:image/png;base64,' + data.backImage, yHeight : data.yHeight, refreshcallback : function() { //刷新验证码 createcode(); }, callback : function(msg) { console.log(msg); var $this = this; $ .ajax({ type : 'POST', url : '/checkImgCode', data : { xpos : msg.xpos, capcode : data.capcode }, dataType : 'json', success : function( data) { console .log(data) if (data.code == 1) { $this .getsuccess(); } else { if (data.code == 4) { createcode(); } else if (data.code == 3) { $this .getfail("验证码过期,请刷新"); } else { $this .getfail("验证不通过"); } } } }) } }); } } }) } </script> </body> </html>
到此这篇关于Java实现滑动验证码的示例代码的文章就介绍到这了,更多相关Java滑动验证码内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!
最新评论