gitee网址：
https://gitee.com/fanzixia/fruit-mall
这个文章主讲主干逻辑，一些必须静态资源需要前往git获取
下载完成后使用idea直接open此文件即可，不需要特殊部署
数据库配置和文件结构讲解请见 README.md
tips：此工程可能后期会成为水果商城，但是登录注册不会大改，有一定java基础的可以放心使用
简介
页面带有正值
登录：可以记录密码错误时间和密码错误次数，超过五次账号当天冻结不可再登，第二天自动解封
注册：用户名必须为字母或数字，且长度为3-10，密码必须为数字3-10位
如果需要修改正值的内容，只需要修改以下几个地方
用户名失去焦点时就可检验用户名是否重复
正题
数据库：
/*
Navicat MySQL Data Transfer
Source Server : localhost_3306
Source Server Type : MySQL
Source Server Version : 50617
Source Host : localhost:3306
Source Schema : fruitmall
Target Server Type : MySQL
Target Server Version : 50617
File Encoding : 65001
Date: 28/11/2021 09:32:18
*/
SET NAMES utf8mb4;
SET FOREIGN_KEY_CHECKS = 0;
-- ----------------------------
-- Table structure for user
-- ----------------------------
DROP TABLE IF EXISTS `user`;
CREATE TABLE `user` (
`id` int(10) NOT NULL AUTO_INCREMENT COMMENT 'ID',
`username` varchar(25) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL COMMENT '用户名',
`password` varchar(25) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL COMMENT '密码',
`createtime` datetime NULL DEFAULT NULL COMMENT '创建时间',
`errortime` datetime NULL DEFAULT NULL COMMENT '错误时间',
`errorcount` int(6) NULL DEFAULT NULL COMMENT '错误次数',
PRIMARY KEY (`id`) USING BTREE
) ENGINE = InnoDB AUTO_INCREMENT = 7 CHARACTER SET = utf8 COLLATE = utf8_general_ci ROW_FORMAT = Compact;
-- ----------------------------
-- Records of user
-- ----------------------------
INSERT INTO `user` VALUES (1, 'fanzixia', '123', '2021-11-22 13:01:20', '2021-11-22 20:21:49', 0);
INSERT INTO `user` VALUES (2, 'zhangsan', '123', '2021-11-23 15:17:48', NULL, 0);
INSERT INTO `user` VALUES (3, 'lisi', '123', '2021-11-23 15:19:49', NULL, 0);
INSERT INTO `user` VALUES (4, 'wangwu', '123', '2021-11-23 15:20:07', NULL, 0);
INSERT INTO `user` VALUES (5, 'zhaoliu', '123', '2021-11-23 15:21:57', NULL, 0);
INSERT INTO `user` VALUES (6, 'bling', '987654321', '2021-11-23 15:36:06', NULL, 0);
SET FOREIGN_KEY_CHECKS = 1;前端页面：
登录：
<!DOCTYPE HTML>
<html lang="zxx">
<head>
<title>登录</title>
<!-- Meta tag Keywords -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta charset="UTF-8" />
<meta name="keywords" content=""
/>
<script>
addEventListener("load", function () {
setTimeout(hideURLbar, 0);
}, false);
function hideURLbar() {
window.scrollTo(0, 1);
}
</script>
<!-- Meta tag Keywords -->
<!-- css files -->
<link rel="stylesheet" href="css/style.css" type="text/css" media="all" />
<!-- Style-CSS -->
<link rel="stylesheet" href="css/font-awesome.4.7.0.css">
<!-- Font-Awesome-Icons-CSS -->
<!-- //css files -->
<script src="../js/jquery-1.8.0.js"></script>
<script>
function doLogin() {
var username=$("#username").val();
var password=$("#password").val();
$.ajax({
url: "/login.do",
type: "post",
data: {
username:username,
password:password
},
success: function (user) {
if (user.stateCode!=0){
alert(user.state);
}else {
window.location.href="main.html";
}
}
});
}
</script>
</head>
<body>
<!-- bg effect -->
<div id="bg">
<canvas></canvas>
<canvas></canvas>
<canvas></canvas>
</div>
<!-- //bg effect -->
<!-- title -->
<h1>Fruit Mall</h1>
<!-- //title -->
<!-- content -->
<div class="sub-main-w3">
<form action="#" method="post">
<h2>登录
<i class="fa fa-long-arrow-down"></i>
</h2>
<div class="form-style-agile">
<label>
<i class="fa fa-user"></i>
用户名
</label>
<input placeholder="用户名" id="username" name="Name" type="text" required="">
<font id="usernameTips"></font>
</div>
<div class="form-style-agile">
<label>
<i class="fa fa-unlock-alt"></i>
密码
</label>
<input placeholder="密码" id="password" name="Password" type="password" required="">
<font id="passwordTips"></font>
</div>
<!-- checkbox -->
<div class="wthree-text">
<ul>
<li>
<label class="anim">
<!--<input type="checkbox" class="checkbox" required="">-->
<span><a href="register.html">没有账号？<font color="aqua">注册</font>一个</a></span>
</label>
</li>
<li>
<a href="#">忘记密码?</a>
</li>
</ul>
</div>
<!-- //checkbox -->
<input type="button" value="登录" onclick="doLogin()">
</form>
</div>
<!-- //content -->
<!-- copyright -->
<div class="footer">
</div>
<!-- //copyright -->
<!-- Jquery -->
<script src="js/jquery-1.10.2.js"></script>
<!-- //Jquery -->
<!-- effect js -->
<script src="js/canva_moving_effect.js"></script>
<!-- //effect js -->
</body>
</html>注册：
<!--@ZixiaFan 2021/11/23 13:20-->
<!DOCTYPE html>
<html lang="en">
<head>
<title>注册</title>
<!-- Meta tag Keywords -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta charset="UTF-8" />
<meta name="keywords" content=""
/>
<script>
addEventListener("load", function () {
setTimeout(hideURLbar, 0);
}, false);
function hideURLbar() {
window.scrollTo(0, 1);
}
</script>
<!-- Meta tag Keywords -->
<!-- css files -->
<link rel="stylesheet" href="css/style.css" type="text/css" media="all" />
<!-- Style-CSS -->
<link rel="stylesheet" href="css/font-awesome.4.7.0.css">
<!-- Font-Awesome-Icons-CSS -->
<!-- //css files -->
<script src="../js/jquery-1.8.0.js"></script>
<script type="text/javascript">
//注册提交
function doRegister() {
if($("#agreement").checked()!=true){
alert("请同意用户协议才能完成注册！");
return;
}
//ajax提交数据
$.ajax({
url:"register.do",
type:"post",
data:{
username:$("#username").val(),
password:$("#password").val()
},
success:function (data) {
if(data==1){
alert("注册成功！请尽快设置密码保护，否则忘记密码后无法找回密码");
window.location.href="login.html";
}else {
alert("系统错误，注册失败，强联系客服");
}
}
});
}
//正值
$(function () {
$("#username").blur(function () {
var name=$("#username").val();
var nameRge=/^[a-zA-Z]{3,10}$/;
if (!nameRge.test(name)){
$("#usernameTips").html("您输入的用户名不符合标准");
$("#username").val("");
return;
}
$.ajax({
url: "UniqueUsername.do",
type: "post",
data: {
username:$("#username").val()
},
success:function (data) {
if(data==0){
$("#usernameTips").html("用户名已存在");
$("#username").val("");
}else {
$("#usernameTips").html("");
}
}
});
});
$("#password").blur(function () {
var pwd=$("#password").val();
var pwdRge=/^\d{3,10}$/;
if (!pwdRge.test(pwd)){
$("#passwordTips").html("您输入的密码不符合标准");
$("#password").val("");
return;
}else {
$("#passwordTips").html("");
}
});
$("#rpassword").blur(function () {
var pwd=$("#password").val();
var rpwd=$("#rpassword").val();
if (pwd!=rpwd){
$("#rpasswordTips").html("两次密码不一致");
$("#rpassword").val("");
return;
}else {
$("#rpasswordTips").html("");
}
});
});
</script>
</head>
<body>
<!-- bg effect -->
<div id="bg">
<canvas></canvas>
<canvas></canvas>
<canvas></canvas>
</div>
<!-- //bg effect -->
<!-- title -->
<h1>Fruit Mall</h1>
<!-- //title -->
<!-- content -->
<div class="sub-main-w3" id="abc">
<form action="#" method="post">
<h2>注册
<i class="fa fa-long-arrow-down"></i>
</h2>
<div class="form-style-agile">
<label>
<i class="fa fa-user"></i>
用户名
</label>
<input placeholder="用户名" id="username" name="Name" type="text" required="">
<font id="usernameTips" color="#dc143c"></font>
</div>
<div class="form-style-agile">
<label>
<i class="fa fa-unlock-alt"></i>
密码
</label>
<input placeholder="密码" id="password" name="Password" type="password" required="">
<font id="passwordTips" color="#dc143c"></font>
</div>
<div class="form-style-agile">
<label>
<i class="fa fa-unlock-alt"></i>
确认密码
</label>
<input placeholder="密码" id="rpassword" name="rPassword" type="password" required="">
<font id="rpasswordTips" color="#dc143c"></font>
</div>
<!-- checkbox -->
<div class="wthree-text">
<ul>
<li>
<label class="anim">
<input type="checkbox" id="agreement" class="checkbox" required="">
<span>同意用户协议</span>
</label>
</li>
<li>
<a href="toLogin">已有账号?前去<font color="aqua">登录</font></a>
</li>
</ul>
</div>
<!-- //checkbox -->
<input type="button" value="注册" onclick="doRegister()">
</form>
</div>
<!-- //content -->
<!-- copyright -->
<div class="footer">
</div>
<!-- //copyright -->
<!-- Jquery -->
<script src="js/jquery-1.10.2.js"></script>
<!-- //Jquery -->
<!-- effect js -->
<script src="js/canva_moving_effect.js"></script>
<!-- //effect js -->
</body>
</html>JavaBean
package com.fan.admin.bean;
/**
* ZixiaFan
* 2021/11/15 14:04
*/
public class User {
private Integer id;
private String username;
private String password;
private String createtime;
private String errortime;
private Integer errorcount;
private int stateCode;//状态码
private String state;//状态
public User() {
}
public User(Integer id, String username, String password) {
this.id = id;
this.username = username;
this.password = password;
}
public User(Integer id, String username, String password, String createtime, String errortime, Integer errorcount) {
this.id = id;
this.username = username;
this.password = password;
this.createtime = createtime;
this.errortime = errortime;
this.errorcount = errorcount;
}
public String getUsername() {
return username;
}
public void setUsername(String userName) {
this.username = userName;
}
public String getPassword() {
return password;
}
public void setPassword(String passWord) {
this.password = passWord;
}
public Integer getId() {
return id;
}
public void setId(Integer id) {
this.id = id;
}
public String getCreatetime() {
return createtime;
}
public void setCreatetime(String createtime) {
this.createtime = createtime;
}
public String getErrortime() {
return errortime;
}
public void setErrortime(String errortime) {
this.errortime = errortime;
}
public Integer getErrorcount() {
return errorcount;
}
public void setErrorcount(Integer errorcount) {
this.errorcount = errorcount;
}
public int getStateCode() {
return stateCode;
}
public void setStateCode(int stateCode) {
this.stateCode = stateCode;
}
public String getState() {
return state;
}
public void setState(String state) {
this.state = state;
}
@Override
public String toString() {
return "User{" +
"id=" + id +
", username='" + username + '\'' +
", password='" + password + '\'' +
", createtime='" + createtime + '\'' +
", errortime='" + errortime + '\'' +
", errorcount=" + errorcount +
", stateCode=" + stateCode +
", state='" + state + '\'' +
'}';
}
}
controller
控制页面跳转的 indexController
package com.fan.admin.controller;
import com.fan.admin.bean.User;
import com.fan.admin.service.UserServiceImpl;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.ResponseBody;
/**
* ZixiaFan
* 2021/11/15 12:46
*/
@Controller
public class indexController {
@Autowired
UserServiceImpl userService;
@GetMapping(value = {"/","/index"})
public String loginPage(){
return "index";
}
@GetMapping(value = {"/toLogin","login.html"})
public String toLogin(){
return "user/login";
}
@GetMapping(value = {"main.html","main"})
public String toMain(){
return "index";
}
@GetMapping(value = {"register.html","register"})
public String toRegister(){
return "user/register";
}
}
UserController
package com.fan.admin.controller;
import com.fan.admin.bean.User;
import com.fan.admin.service.UserServiceImpl;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.ResponseBody;
import javax.servlet.http.HttpSession;
/**
* ZixiaFan
* 2021/11/23 14:03
*/
@Controller
public class UserController {
@Autowired
UserServiceImpl userService;
/**
* 登录
* @param username
* @param password
* @return
*/
@ResponseBody
@PostMapping("/login.do")
public User login(@RequestParam("username") String username, @RequestParam("password") String password , HttpSession session){
User user= new User();
user.setPassword(password);
user.setUsername(username);
User login = userService.login(user);
if (login.getStateCode()==0){
session.setAttribute("user",login);
}
return login;
}
/**
* 注册
* @param username
* @param password
* @return
*/
@ResponseBody
@PostMapping("/register.do")
public int register(@RequestParam("username") String username, @RequestParam("password") String password){
User user= new User();
user.setPassword(password);
user.setUsername(username);
System.out.println(user);
int res = userService.register(user);
return res;
}
/**
* 验证用户名是否唯一
* @return 0 不唯一 1 唯一
*/
@ResponseBody
@PostMapping("/UniqueUsername.do")
public int UniqueUsername(@RequestParam("username") String username){
int res= userService.UniqueUsername(username);
return res;
}
@GetMapping("/toUserHome")
public String toUserHome(){
return "user/userHome";
}
}
service
业务逻辑：UserService 接口
package com.fan.admin.service;
import com.fan.admin.bean.User;
/**
* ZixiaFan
* 2021/11/22 16:36
*/
public interface UserServvice {
/**
* 登录
* @param user
* @return
*/
public User login(User user);
/**
* 注册
* @param user
* @return
*/
public int register(User user);
/**
* 验证用户名是否唯一
* @param username
* @return
*/
int UniqueUsername(String username);
}
业务逻辑实现：UserServiceImpl
package com.fan.admin.service;
import com.fan.admin.bean.User;
import com.fan.admin.mapper.UserMapper;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
import java.text.SimpleDateFormat;
import java.util.Date;
/**
* ZixiaFan
* 2021/11/21 18:57
*/
@Service
public class UserServiceImpl implements UserServvice {
@Autowired
UserMapper userMapper;
/**
* 登录
* @return 0:成功 1：今日错误次数超过五次，请明天再试" 2：密码错误 3：用户名不存在
*/
public User login(User user){
int res=-1;
String s="";
Date date=new Date();
String t = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss").format(date);
//检查用户名是否存在
User u = userMapper.queryUsernameExists(user.getUsername());
if (u!=null){//存在 查看今日失败次数 >5 不允许登录
if (u.getErrorcount()>=5){
//检查次数有无过时
User user1=u;
u.setErrortime(t);
Integer errorDay = userMapper.queryErrorDay(user1);
if (errorDay>=1){
if (u.getPassword().equals(user.getPassword())){
user1.setErrorcount(0);
userMapper.updateErrorCount(user1);
s="登陆成功";
u.setErrorcount(0);
userMapper.updateErrorCount(u);
res=0;
}else {
user1.setErrortime(t);
user1.setErrorcount(1);
userMapper.updateCountTime(user1);
}
}else {
s="今日错误次数超过五次，请明天再试";
res=1;
}
}else {//<5 验证用户名和密码是否对应
// User user1 = userMapper.login(user);
if (u.getPassword().equals(user.getPassword())){
s="登陆成功";
u.setErrorcount(0);
userMapper.updateErrorCount(u);
res=0;
}else {
s="密码错误";
res=2;
u.setErrortime(t);
u.setErrorcount(1+u.getErrorcount());
userMapper.updateCountTime(u);
}
}
}else {//不存在 提示 用户名是否存在
s="用户名不存在";
res=3;
}
user.setState(s);
user.setStateCode(res);
return user;
}
/**
* 注册
* @param user
* @return
*/
@Override
public int register(User user) {
Date date=new Date();
String t = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss").format(date);
user.setCreatetime(t);
return userMapper.register(user);
}
/**
* 验证用户名是否唯一
* @param username
* @return
*/
@Override
public int UniqueUsername(String username) {
User user = userMapper.queryUsernameExists(username);
if (user!=null){
return 0;
}else {
return 1;
}
}
}
数据库访问层mapper
UserMapper 接口：定义数据库访问的逻辑
package com.fan.admin.mapper;
import com.fan.admin.bean.User;
import org.apache.ibatis.annotations.Mapper;
/**
* ZixiaFan
* 2021/11/21 18:45
*/
@Mapper
public interface UserMapper {
/**
* 验证用户名密码是否对应
* @param user
* @return
*/
public User login(User user);
/**
* 查询用户名是否存在
* @param username
* @return
*/
public User queryUsernameExists(String username);
/**
* 检查错误天数
* @param user=errortime是当前时间，比较数据库存的错误时间
* @return 错误天数
*/
public Integer queryErrorDay(User user);
/**
* 更改错误次数
* @param user=存的错误次数
* @return
*/
public int updateErrorCount(User user);
/**
* 更改错误时间并且使count+1
* @param user
* @return
*/
public int updateCountTime(User user);
/**
* 注册
* @param user
* @return 0 失败 1 成功
*/
int register(User user);
}
UserMapper.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.fan.admin.mapper.UserMapper">
<select id="login" resultType="com.fan.admin.bean.User" parameterType="com.fan.admin.bean.User">
select * from user where username=#{username} and password=#{password}
</select>
<select id="queryUsernameExists" parameterType="String" resultType="com.fan.admin.bean.User">
select * from user where username=#{username}
</select>
<select id="queryErrorDay" parameterType="com.fan.admin.bean.User" resultType="Integer">
select DATEDIFF(#{errortime},errortime) as ErrorDay from user where id=#{id}
</select>
<update id="updateErrorCount" parameterType="com.fan.admin.bean.User">
update user set errorcount=#{errorcount} where id=#{id}
</update>
<update id="updateCountTime" parameterType="com.fan.admin.bean.User">
update user set errorcount=#{errorcount} , errortime=#{errortime} where id=#{id}
</update>
<insert id="register" parameterType="com.fan.admin.bean.User">
insert into user (username,password,createtime,errorcount) values (#{username},#{password},#{createtime},0)
</insert>
</mapper>分享总结
如有侵权，请联系删除
143
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
