hutool+springboot+springSecurity 实现验证码登录校验

1.pom.xml需要增加social和hotool的引入，如下：

<dependency> <groupId>org.springframework.social</groupId> <artifactId>spring-social-web</artifactId> <version>1.1.6.RELEASE</version> </dependency> <dependency> <groupId>cn.hutool</groupId> <artifactId>hutool-all</artifactId> <version>5.0.3</version> </dependency>

 

2.创建生成验证码和校验验证码的 ValidateCodeController，代码如下：

import cn.hutool.captcha.CaptchaUtil; import cn.hutool.captcha.LineCaptcha; import cn.hutool.core.util.StrUtil; import org.springframework.social.connect.web.HttpSessionSessionStrategy; import org.springframework.social.connect.web.SessionStrategy; import org.springframework.ui.Model; import org.springframework.web.bind.annotation.GetMapping; import org.springframework.web.bind.annotation.RequestParam; import org.springframework.web.bind.annotation.ResponseBody; import org.springframework.web.bind.annotation.RestController; import org.springframework.web.context.request.ServletWebRequest; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import java.io.IOException; /** * 生成验证码的控制类 * */ @RestController public class ValidateCodeController { public static final String SESSION_KEY = "SESSION_KEY_IMAGE_CODE"; private SessionStrategy sessionStrategy = new HttpSessionSessionStrategy(); @GetMapping("/validate/code/image") public void createCode(HttpServletResponse response, HttpServletRequest request) throws IOException { String sessionId = request.getSession().getId(); LineCaptcha captcha = CaptchaUtil.createLineCaptcha(85, 33,4,30); captcha.write(response.getOutputStream()); String imageCode = captcha.getCode(); sessionStrategy.setAttribute(new ServletWebRequest(request),sessionId+"_"+SESSION_KEY,imageCode.toLowerCase()); } @ResponseBody @GetMapping("/validate/code/check") public boolean validateCode(@RequestParam(value = "loginCode",required = false) String loginCode, HttpServletRequest request, Model model){ Boolean status = true; String sessionId = request.getSession().getId(); String sessionCode = (String)sessionStrategy.getAttribute(new ServletWebRequest(request), sessionId+"_"+SESSION_KEY);//session code if(null==loginCode || StrUtil.isBlank(loginCode)){ status = false; }else if(loginCode.length() != 4){ status = false; }else if(!loginCode.equals(sessionCode)){ status = false; } return status; } }

3.在Security配置类方法configure里增加ValidationCodeFilter拦截器，代码如下：

httpSecurity.addFilterBefore(validationCodeFilter,UsernamePasswordAuthenticationFilter.class);

@Slf4j @Component("validationCodeFilter") public class ValidationCodeFilter extends OncePerRequestFilter implements Filter { @Autowired private MyAuthenticationFailHandler authenticationFailHandler; private SessionStrategy sessionStrategy = new HttpSessionSessionStrategy(); private static final String SESSION_KEY = "SESSION_KEY_IMAGE_CODE"; @Override protected void doFilterInternal(HttpServletRequest request, HttpServletResponse response, FilterChain filterChain) throws ServletException, IOException { if (StringUtils.equals("/login", request.getRequestURI()) && StringUtils.equalsIgnoreCase("post", request.getMethod())) { try { validate(new ServletWebRequest(request)); } catch (AuthenticationException e) { authenticationFailHandler.onAuthenticationFailure(request, response, e); return; } } filterChain.doFilter(request, response); } private void validate(ServletWebRequest request) throws ServletRequestBindingException { String sessionId = request.getSessionId(); String loginCode = request.getParameter("imageCode");// login imageCode String sessionCode = (String)sessionStrategy.getAttribute(request, sessionId+"_"+SESSION_KEY);//session code if(null == loginCode || "".equals(loginCode)){ sessionStrategy.removeAttribute(request, sessionId+"_"+SESSION_KEY); throw new ValidateCodeException("verification code can not be empty!"); }else if(null == sessionCode || "".equals(sessionCode)){ sessionStrategy.removeAttribute(request, sessionId+"_"+SESSION_KEY); throw new ValidateCodeException("session code can not be empty!"); }else if (!sessionCode.equals(loginCode.toLowerCase())) { sessionStrategy.removeAttribute(request, sessionId+"_"+SESSION_KEY); throw new ValidateCodeException("verification code invalid!"); } sessionStrategy.removeAttribute(request, sessionId+"_"+SESSION_KEY); } }

4，login.html页面相关代码如下：

<div class="form-group has-feedback row"> <div class="col-xs-8" id="divValidate"> <input type="text" class="form-control" id="imageCode" name="imageCode" placeholder="code" th:onkeyup="validateCode()"/> <span id="validateIcon" class="form-control-feedback" style="left: 185px;"></span> </div> <div class="col-xs-4"> <img id="validatecode" src="/validate/code/image" onclick="refreshCode();"> </div> </div>

function refreshCode() { $("#validatecode").attr("src", "/validate/code/image?time" + new Date().getTime()); $("#imageCode").val(""); } function validateCode(){ var imageCode = $("#imageCode").val(); if(null==imageCode || imageCode.length<1 || imageCode.length != 4){ validateIconClass(false);return null; } $.get("/validate/code/check?loginCode="+imageCode, function(data){ if(null==data || ""==data || "false"==data){ validateIconClass(false);return null; } validateIconClass(true);return null; }); } function validateIconClass(status){ if(status){ $("#validateIcon").removeClass("glyphicon glyphicon-remove form-control-feedback"); $("#divValidate").removeClass("has-error"); $("#validateIcon").addClass("glyphicon glyphicon-ok form-control-feedback"); }else{ $("#validateIcon").removeClass("glyphicon glyphicon-ok form-control-feedback"); $("#divValidate").addClass("has-error"); $("#validateIcon").addClass("glyphicon glyphicon-remove form-control-feedback"); } }

最后推荐一个比较成熟的spring cloud 架构，欢迎大家支持和收藏 https://gitee.com/gitsc/pro-cloud