依赖
<dependency>
<groupId>com.github.whvcsegroupId>
<artifactId>easy-captchaartifactId>
<version>1.6.2version>
dependency>
package com.jm.sso.server.util;
import cn.hutool.core.util.StrUtil;
import com.jm.sso.base.controller.BaseController;
import com.jm.sso.base.result.BaseResponse;
import com.jm.sso.base.util.IpUtils;
import com.jm.sso.base.util.RedisCache;
import com.jm.sso.server.constant.RedisCons;
import com.wf.captcha.ArithmeticCaptcha;
import com.wf.captcha.SpecCaptcha;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Component;
import org.springframework.web.bind.annotation.GetMapping;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.util.HashMap;
import java.util.UUID;
import java.util.concurrent.TimeUnit;
@Component
public class CaptchaUtil extends BaseController {
@Autowired
private RedisCache redisCache;
public void mathCaptcha( HttpServletResponse response) {
response.setContentType("image/jpg");
response.setHeader("Pargam", "No-cache");
response.setHeader("Cache-Control", "no-cache");
response.setDateHeader("Expires", 0);
ArithmeticCaptcha captcha = new ArithmeticCaptcha(130, 32, 3);
redisCache.setCacheObject(StrUtil.format(RedisCons.CAPTCHA_CODE, IpUtils.getIpAddr()), captcha.text(), 180, TimeUnit.SECONDS);
try {
captcha.out(response.getOutputStream());
} catch (IOException e) {
e.printStackTrace();
}
}
public BaseResponse captcha(HttpServletRequest request, HttpServletResponse response) throws Exception {
SpecCaptcha specCaptcha = new SpecCaptcha(130, 48, 5);
String verCode = specCaptcha.text().toLowerCase();
String key = StrUtil.format(RedisCons.CAPTCHA_CODE, IpUtils.getIpAddr());
redisCache.setCacheObject(key, verCode, 30,TimeUnit.SECONDS);
HashMap<String,String> map = new HashMap<>();
map.put("key", key);
map.put("image", specCaptcha.toBase64());
return setResultSuccess(map);
}
public BaseResponse verifyCode( String code) {
String key = StrUtil.format(RedisCons.CAPTCHA_CODE, IpUtils.getIpAddr());
String captcha = redisCache.getCacheObject(key);
if(StrUtil.isBlank(captcha)){
return setResultError("验证码失效");
}
if(StrUtil.equals(captcha,code)){
redisCache.deleteObject(key);
return setResultSuccess();
}
return setResultError("验证码校验失败");
}
}
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
- 48
- 49
- 50
- 51
- 52
- 53
- 54
- 55
- 56
- 57
- 58
- 59
- 60
- 61
- 62
- 63
- 64
- 65
- 66
- 67
- 68
- 69
- 70
- 71
- 72
- 73
- 74
- 75
- 76
DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Documenttitle>
<style>
* {
margin: 0;
padding: 0;
}
html {
height: 100%;
}
body {
height: 100%;
}
.container {
height: 100%;
background-image: linear-gradient(to right, #fbc2eb, #a6c1ee);
}
.login-wrapper {
background-color: #fff;
width: 358px;
height: 588px;
border-radius: 15px;
padding: 0 50px;
position: relative;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
.header {
font-size: 38px;
font-weight: bold;
text-align: center;
line-height: 200px;
}
.input-item {
display: block;
width: 100%;
margin-bottom: 20px;
border: 0;
padding: 10px;
border-bottom: 1px solid rgb(128, 125, 125);
font-size: 15px;
outline: none;
}
.input-item:placeholder {
text-transform: uppercase;
}
.btn {
text-align: center;
padding: 10px;
width: 100%;
margin-top: 40px;
background-image: linear-gradient(to right, #a6c1ee, #fbc2eb);
color: #fff;
}
.msg {
text-align: center;
line-height: 88px;
}
a {
text-decoration-line: none;
color: #abc1ee;
}
style>
head>
<body>
<div class="container">
<div class="login-wrapper">
<div class="header">Logindiv>
<div class="form-wrapper">
<input id="username" type="text" name="username" placeholder="username" class="input-item">
<input id="passowrd" type="password" name="password" placeholder="password" class="input-item">
<img id="captcha" ref="vcImg" onclick="getCaptcha()">
<div class="btn"onclick="doLogin()">Logindiv>
div>
<div class="msg">
Don't have account?
<a href="#">Sign upa>
div>
div>
div>
body>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.2/jquery.js">script>
<script>
getCaptcha();
function getCaptcha() {
$("#captcha").attr("src", "/mathCaptcha?" + "&time=" + new Date());
console.log("请求准备发送");
}
function doLogin(){
var username = document.getElementById("username").value;
var passowrd = document.getElementById("passowrd").value;
alert(username);
alert(passowrd);
}
script>
html>
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
- 48
- 49
- 50
- 51
- 52
- 53
- 54
- 55
- 56
- 57
- 58
- 59
- 60
- 61
- 62
- 63
- 64
- 65
- 66
- 67
- 68
- 69
- 70
- 71
- 72
- 73
- 74
- 75
- 76
- 77
- 78
- 79
- 80
- 81
- 82
- 83
- 84
- 85
- 86
- 87
- 88
- 89
- 90
- 91
- 92
- 93
- 94
- 95
- 96
- 97
- 98
- 99
- 100
- 101
- 102
- 103
- 104
- 105
- 106
- 107
- 108
- 109
- 110
- 111
- 112
- 113
- 114
- 115
- 116
- 117
- 118
- 119
- 120
- 121
- 122
- 123
- 124
- 125
- 126
- 127
- 128
- 129
- 130
- 131
- 132