图片验证码
@RequestMapping("/code")
public void code(HttpServletResponse response, HttpSession session) throws IOException {
CircleCaptcha circleCaptcha=new CircleCaptcha(110,40,4,4);
session.setAttribute("code",circleCaptcha.getCode());
circleCaptcha.write(response.getOutputStream());
}
bulinbulin的验证码
public void services(HttpServletRequest req, HttpServletResponse resp) throws IOException {
GifCaptcha gifCaptcha = CaptchaUtil.createGifCaptcha(200, 100, 4);
String code = gifCaptcha.getCode();
req.getSession().setAttribute("code",code);
gifCaptcha.write(resp.getOutputStream());
resp.getOutputStream().close();
}
controller
@RequestMapping("login")
@ResponseBody
public JsonData login(Student student, Teacher teacher,String verifyCode,String r,HttpSession session){
String code = (String) session.getAttribute("code");
if (verifyCode==null||!code.equals(verifyCode)){
return JsonData.buildError("验证码错误");
}
if (r.equals("0")){
return teacherService.login(teacher);
}
JsonData login = studentService.login(student);
session.setAttribute("stu",login.getData());
return login;
}
login.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>登录</title>
<link rel="stylesheet" href="layui/css/layui.css">
</head>
<style type="text/css">
#reOne{
border: 1px solid black;
margin-top: 100px;
margin-left: 35%;
overflow: auto;
float: left;
width: 450px;
}
h2{
padding-top: 30px;
padding-left: 185px;
margin-bottom: 23px;
color: #1E9FFF;
}
</style>
<body>
<div id="reOne">
<h2>用户登录</h2>
<form class="layui-form" id="form1">
<div class="layui-form-item">
<label class="layui-form-label">用户名</label>
<div class="layui-input-inline">
<input type="text" name="username" placeholder="请输入用户名"class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">密码</label>
<div class="layui-input-inline">
<input type="password" name="pwd" placeholder="请输入密码"class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">验证码</label>
<div class="layui-input-inline">
<div style="float: left;">
<input type="text" name="verifyCode" id="verifyCode" placeholder="请输入验证码" autocomplete="off" class="layui-input verity">
</div>
<div style="float: left;">
<img id="verify" onclick="chageCode()" alt="点击刷新验证码" style="width: 90%;height: 39px;" />
</div>
</div>
</div>
<div class="layui-form-item">
<div class="layui-input-block">
<button class="layui-btn" type="button" id="login" lay-filter="formDemo">登录</button>
</div>
</div>
<div>
<label>角色</label>
<div >
<input type="radio" name="r" value="0" title="老师" checked="">
<input type="radio" name="r" value="1" title="学生">
</div>
</div>
</form>
</div>
<script src="/layui/layui.js"></script>
<script src="/js/jquery-3.2.1.js"></script>
<script>
layui.use(['form','layer','jquery'], function(){
var form = layui.form,
$ = layui.jquery,
layer = layui.layer;
$(document).on('click','#login',function(){
$.ajax({
url : '/login',// 跳转到 action
type : 'post',
data :$("#form1").serialize(),
success : function(data) {
if(data.code == -1){
layer.msg(data.msg);
return false;
}
if (data.code==0){
window.location.href = '/Tem.html';
}else {
window.location.href = '/student.html';
}
},
error : function(error) {
// view("异常！");
alert(error.msg);
}
});
});
});
function chageCode(){
$('#verify').attr('src','/code?random='+new Date());//链接后添加Math.random，确保每次产生新的验证码，避免缓存问题。
}
chageCode();
</script>
</body>
</html>
serviceImpl
(都雷同)
public JsonData login(Student student) {
Student login = stuMapper.login(student);
if (login!=null){
return JsonData.buildSuccess(0,login);
}
return JsonData.buildError("账号或密码错误");
}
public JsonData login(Teacher teacher) {
Teacher login = teacherMapper.login(teacher);
if (login!=null){
return JsonData.buildSuccess(1,login);
}
return JsonData.buildError("账户名或密码错误");
}
mapper.xml
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd" >
<mapper namespace="com.hp.mapper.TeacherMapper">
<select id="login" resultType="com.hp.pojo.Teacher">
select * from teacher where username=#{username} and pwd=#{pwd}
</select>
</mapper>
