kaptcha-spring-boot-starter使用
华季同
官方git
example
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>MyShop——登录</title>
<link rel="stylesheet" type="text/css" href="../static/assets/css/index.css" th:href="@{/assets/css/index.css}">
<link rel="stylesheet" type="text/css" href="../static/assets/css/ziy.css" th:href="@{/assets/css/ziy.css}">
</head>
<body>
<div class="beij_center">
<div class="dengl_logo">
<img src="../static/assets/images/logo_1.png" th:src="@{/assets/images/logo_1.png}">
<h1>欢迎登录</h1>
</div>
</div>
<div class="dengl_beij">
<div class="banner_xin">
<img src="../static/assets/images/ss.jpg" th:src="@{/assets/images/ss.jpg}">
</div>
<div class="beij_center dengl_jvz">
<div class="login_form">
<div class="login_tab">
<h2>欢迎登录</h2>
<div class="dengl_erwm">
<a href="#"><img src="../static/assets/images/er_wm.png" th:src="@{/assets/images/er_wm.png}"></a>
<div class="tanc_erwm_kuang">
<img src="../static/assets/images/mb_wangid.png" th:src="@{/assets/images/mb_wangid.png}">
<div class="qrcode_panel">
<ul>
<li class="fore1">
<span>打开</span>
<a href="#" target="_blank"> <span class="red">手机MyShop</span></a>
</li>
<li>扫描二维码</li>
</ul>
</div>
</div>
</div>
</div>
<div class="kengl_kuang">
<div id="loginMsg" th:if="${message} != null">
<div class="red" th:utext="${message}"></div>
</div>
<div class="red" id="kaptchaMsg"></div>
<form th:action="@{/login}" method="post" onsubmit="return checkCode()">
<div class="txt_kuang">
<input id="email" name="email" class="itxt" placeholder="邮箱/用户名/已验证手机">
<input type="password" name="password" class="itxt" placeholder="密码">
<input id="verification" name="verification" type="text" class="itxt" placeholder="验证码">
<img id="validateCode" src="/kaptcha/render" th:src="@{/kaptcha/render}" style="float: right; padding-right: 23px; cursor: pointer;" title="看不清？换一张" />
</div>
<div class="remember">
<div class="fl">
<input type="checkbox" >
<label>自动登录</label>
</div>
<div class="fr">
<a href="#" class="fl" target="_blank" title="忘记密码">忘记密码?</a>
</div>
</div>
<input type="submit" tabindex="5" value="登 录" class="btnnuw">
</form>
</div>
<div class="corp_login">
<div class="mingb_shoq"><a href="#">名榜授权登录！</a></div>
<div class="regist_link"><a href="zhuc.html" target="_blank"><b></b>立即注册</a></div>
</div>
</div>
</div>
</div>
<div class="jianj_dib">
<div class="beia_hao">
<p>京ICP备：123456789号 </p>
<p class="gonga_bei">京公网安备：123456789号</p>
</div>
</div>
<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
<script>
$(function () {
// 刷新验证码
$("#validateCode").bind("click", function () {
$(this).hide().attr('src', '/kaptcha/render?' + Math.random()).fadeIn();
});
});
function checkCode() {
var code = $("#verification").val();
var result = false;
$.ajax({
url: "/kaptcha/valid",
type: "POST",
data: {"code": code},
async: false,
success: function (msg) {
if(msg.length == 0){
result = true;
}else{
$("#kaptchaMsg").html(msg);
$("#loginMsg").hide();
}
}
});
return result;
}
</script>
</body>
</html>
类似资料：
相关阅读
相关问答
使用Spring Boot WebFlux Starter时出现java.lang.OutOfMemoryError我可以使用spring-boot-starter-tomcat而不使用spring-boot-starter-web提供静态内容吗？spring-boot-starter-web和spring-boot-starter-webflux不是一起工作吗？有没有办法使用spring boot starter应用程序graphql spring boot starter公开2个graphqlendpoint？spring boot startup与spring boot JPA Starter的问题