简单登录系统的小案例
2020年5月19日
额，今天是520的前一天，虽然跟我没啥关系 这几天做了一个简单的登录系统
1、初衷
主要是测试自己对springBoot的理解和掌握(因为自己前段时间自学了这个springBoot所以想测试一下)还有就是对SSM的回顾
话不多说上代码(Don't talk too much about code)
2、开发环境
语言Java
2_1、开发工具
基于IntelliJ IDEA 2019.3
2_2、技术选型
前端(还没学Vue)
基础的HTML5 CSS JavaScript
JQuery
后端
SpringBoot(2.3.0.RELEASE)
基础的SpringMVC、Spring 5.x和MyBatis3
templates
MySql5.7
项目管理工具
Maven(3.6.3)
Git
GitHub项目的地址 （https://github.com/hello9geg/sms-login）
短信API(腾讯云) (如有不懂,自行百度)
重要的pom.xml文件
<properties>
<java.version>1.8</java.version>
<thymeleaf.version>3.0.11.RELEASE</thymeleaf.version>
<!-- 布局功能的支持程序 thymeleaf3主程序 layout2以上版本 一个适配-->
<!-- thymeleaf2 layout1-->
<thymeleaf-layout-dialect.version>2.4.1</thymeleaf-layout-dialect.version>
</properties>
<dependencies>
<!-- 引入web模块 可以暂时先把它看成springMvc -->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web</artifactId>
</dependency>
<!-- 引入thymeleaf模板引擎 -->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
<!-- 引入外部的jqueryJar-->
<dependency>
<groupId>org.webjars</groupId>
<artifactId>jquery</artifactId>
<version>3.3.1</version>
</dependency>
<!--导入配置文件处理器，配置文件进行绑定就会有提示-->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-configuration-processor</artifactId>
<optional>true</optional>
</dependency>
<!-- 引入myBatis -->
<dependency>
<groupId>org.mybatis.spring.boot</groupId>
<artifactId>mybatis-spring-boot-starter</artifactId>
<version>2.1.2</version>
</dependency>
<!-- 引入mysql驱动 -->
<dependency>
<groupId>mysql</groupId>
<artifactId>mysql-connector-java</artifactId>
<scope>runtime</scope>
</dependency>
<!-- 引入Druid数据池 -->
<dependency>
<groupId>com.alibaba</groupId>
<artifactId>druid</artifactId>
<version>1.1.20</version>
</dependency>
<!-- 引入腾讯云的Jar -->
<dependency>
<groupId>com.github.qcloudsms</groupId>
<artifactId>qcloudsms</artifactId>
<version>1.0.6</version>
</dependency>
<!-- 创建springBoot项目自带的测试组件 -->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-test</artifactId>
<scope>test</scope>
<exclusions>
<exclusion>
<groupId>org.junit.vintage</groupId>
<artifactId>junit-vintage-engine</artifactId>
</exclusion>
</exclusions>
</dependency>
</dependencies>
<build>
<plugins>
<!-- 创建springBoot项目自带的插件(打War包) -->
<plugin>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-maven-plugin</artifactId>
</plugin>
</plugins>
</build>
</project>
3、Java后台代码
3_1、Controller：这个主要是对发短信的业务的处理
package com.springboot.smslogin.controller;
import com.github.qcloudsms.SmsSingleSender;
import com.github.qcloudsms.SmsSingleSenderResult;
import com.github.qcloudsms.httpclient.HTTPException;
import com.springboot.smslogin.entity.UserInfo;
import com.springboot.smslogin.service.UserService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import javax.servlet.http.HttpSession;
import java.io.IOException;
import java.util.Random;
/**
* @author
* @date
* @description
*/
@Controller
@RequestMapping("/userController")
public class UserController {
@Autowired
private UserService userService;
@RequestMapping("/sms")
@ResponseBody //因为后台传来的ajax所以要加这个注解
//smsphone 前台传来的smsphone(键)
public String smsCode(String smsphone){
String json = null;
//判断手机号是否被注册过
boolean result = userService.findUserInfoByPhone(smsphone);
if(result == false){
json = "{\"message\":"+ false +"}";
return json;
}else{
//发送短信 获取返回值
String sms = SMS(smsphone);
json = "{\"message\":"+ true +",\"sms\":\""+ sms +"\"}";
return json;
}
}
//发送短信 返回发送的验证码
private String SMS(String phone) {
String phoneNumber = phone;
//短信内容 templateId这个Id对应着短信内容
int templateId = 200461;
//验证码
String[] params = new String[1];
//生成一个随机的验证码
String code = "";
Random r = new Random();
for (int i = 1; i <=4 ; i++) {
code += r.nextInt(10);
}
//存放随机的一个验证码
params[0] = code;
System.out.println(code+"=====================");
//签名
String sign = "tLain公众号";
//拿到发送短信的核心类
SmsSingleSender sender = new SmsSingleSender(1400142856,"21306d751cfdf61ed433e506da242522");
//发送短信
try {
SmsSingleSenderResult result = sender.sendWithParam("86", phoneNumber, templateId, params, sign, "", "");
//也可以拿到返回值 这里的返回值用于查看你的错误信息
System.out.println(result);
} catch (HTTPException e) {
e.printStackTrace();
} catch (IOException e) {
e.printStackTrace();
}
return code;
}
@RequestMapping("/register")
public String register(UserInfo userInfo){
boolean result = userService.register(userInfo);
if(result){
//重定向到登录页面
return "redirect:/indexController/index";
}else{
return "redirect:/indexController/registered";
}
}
@RequestMapping("/login")
public String login(UserInfo userInfo, Model model, HttpSession session){
boolean result = userService.login(userInfo);
if (result){
//注册成功重定向到主页面 顺便把用户存取到会话中, 防止表单重复提交,重定向到后台页面
session.setAttribute("userInfo",userInfo);
return "login_success";
}else{
model.addAttribute("message","用户名或者密码错误");
return "index";
}
}
}
3_2、Dao (因为做的系统比较简单,所以数据访问层页比较简单)
@Insert("insert into userInfo(phone,password) values(#{phone}, #{password})")
public abstract Integer saveUserInfo(UserInfo userInfo);
@Select("select * from userInfo where phone = #{phone} and password = #{password}")
public UserInfo findUserInfoByPhoneAndPwd(UserInfo userInfo);
@Select("select * from userInfo where phone = #{phone}")
public abstract UserInfo findUserInfoByPhone(String phone);
4、前台代码
4_1、HTML
4_1_1、注册页面
注册页面代码(HTML和自己写的Js)
<!doctype html>
<!-- 引入templates的命名空间 xmlns:th="http://www.thymeleaf.org" -->
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="css/bootstrap.min.css" type="text/css" rel="stylesheet" th:href="@{/css/bootstrap.min.css}" >
<link href="css/font-awesome.min.css" type="text/javascript" rel="stylesheet" th:href="@{/css/font-awesome.min.css}">
<link href="css/bootsnav.css" type="text/css" rel="stylesheet" th:href="@{/css/bootsnav.css}">
<link href="css/normalize.css" type="text/css" rel="stylesheet" th:href="@{/css/normalize.css}">
<link href="css/css.css" rel="stylesheet" type="text/css" th:href="@{/css/css.css}">
<script src="js/jquery-1.11.0.min.js" type="text/javascript" th:src="@{/js/jquery-1.11.0.min.js}"></script>
<script src="js/jquery.step.js" th:src="@{/js/jquery.step.js}"></script>
<script src="js/bootstrap.min.js" type="text/javascript" th:src="@{/js/bootstrap.min.js}"></script>
<script src="js/bootsnav.js" type="text/javascript" th:src="@{/js/bootsnav.js}"></script>
<script src="js/jquery.js" type="text/javascript" th:src="@{/js/jquery.js}"></script>
<!--[if IE]>
<script src="js/html5.js"></script><![endif]-->
<title>注册</title>
</head>
<body class="logobg_style">
<div id="large-header" class="large-header login-page">
<canvas id="demo-canvas" width="1590" height="711"></canvas>
<div class="Retrieve_style">
<div class="Retrieve-content step-body" id="myStep">
<h1 class="title_name">用户注册</h1>
<div class="step-header">
<ul>
<li><p>输入电话</p></li>
<li><p>确认密码</p></li>
<li><p>成功</p></li>
</ul>
</div>
<div class="step-content">
<div class="step-list login_padding">
<!-- 大表单 -->
<form role="form" id="form_login" class="">
<div class="form-group clearfix">
<div class="input-group col-lg-8 col-md-8 col-xs-8">
<div class="input-group-addon"><i class="icon_phone"></i></div>
<!-- 输入的手机号的框 -->
<input type="text" class="form-control text_phone" name="phone" id="phone"
placeholder="你的手机号" autocomplete="off">
</div>
<!-- 获取验证码的按钮 -->
<div class="col-lg-4 col-md-4 col-xs-4 fl"><input type="button" id="sms-input" class="btn_mfyzm"
value="获取验证码" onclick="SendSMS()"/>
</div>
</div>
<div class="form-group clearfix">
<div class="input-group">
<div class="input-group-addon"><i class="icon_yanzhen"></i></div>
<!-- 输入短信验证码的框 -->
<input type="text" class="form-control" name="Verification" id="sms-code"
placeholder="短信验证码" autocomplete="off">
</div>
</div>
<div class="tishi"></div>
</form>
<div class="form-group">
<!-- 下一步按钮 disabled="disabled" 如果没输入手机号和验证码是不允许点击的 -->
<button class="btn btn-danger btn-block btn-login" id="applyBtn" disabled="disabled" >下一步</button>
</div>
</div>
<div class="step-list">
<form method="post" role="form" id="" class="login_padding">
<div class="form-group clearfix">
<div class="input-group">
<div class="input-group-addon">
<i class="icon_password"></i>
</div>
<!-- 第一个密码框 -->
<input type="password" class="form-control" name="password" id="password"
placeholder="输入密码" autocomplete="off">
</div>
</div>
<div class="form-group clearfix">
<div class="input-group">
<div class="input-group-addon">
<i class="icon_password"></i>
</div>
<!-- 第二个密码框 -->
<input type="password" class="form-control" name="confirmpwd" id="confirmpwd"
placeholder="再次密码" autocomplete="off">
</div>
</div>
<div class="tishis"></div>
<div class="form-group">
<a href="javascript:void(0);" type="submit" class="btn btn-danger btn-block btn-login"
id="submitBtn">注册</a>
</div>
</form>
</div>
<div class="step-list">
<div class="ok_style center">
<h2><img src="images/ok.png" th:src="@{/images/ok.png}"></h2>
<!-- 写一个定时器的效果（倒计时的效果）已完成在jquery.step.js下的28行-->
<h5 class="color2 mtb20">你已成功注册会员<b id="Os">5</b>秒后跳转到首页</h5>
</div>
</div>
<!-- 自己写一个隐藏表单 -->
<form hidden id="sms_form" th:action="@{/userController/register}" method="post">
<input id="sms_userName" name="phone"/>
<input id="sms_password" name="password"/>
</form>
</div>
</div>
</div>
</div>
<script src="js/TweenLite/TweenLite.min.js" th:src="@{/js/TweenLite/TweenLite.min.js}"></script>
<script src="js/TweenLite/EasePack.min.js" th:src="@{/js/TweenLite/EasePack.min.js}"></script>
<script src="js/TweenLite/rAF.js" th:src="@{/js/TweenLite/rAF.js}"></script>
<script src="js/TweenLite/demo-1.js" th:src="@{/js/TweenLite/demo-1.js}"></script>
<!-- 引入layer js 这个脚本主要是做弹出层的效果很不错-->
<script src="js/layer/layer.js" th:src="@{/js/layer/layer.js}"></script>
<!-- th:inline="javascript" 可以在javascript使用thymeleaf语法 -->
<script type="text/javascript" th:inline="javascript">
var tiem = 5;
var InterValOjb;
//用于存储 回调函数的返回值
var sms;
function timer() {
if(tiem == 0){
$("#sms-input").val("重新获取验证码");
//为什么要在这里设置为又把tiem设置为5呢？
// 原因就是为下一次点击按钮做准备，如果下一次点击按钮那就是等于5了，就会走else了，
//然后这样不断的循环，只要有人点按钮就会触发这个事件
tiem = 5;
//点击完一次在设置为false 这里使用原生的Jquery
document.getElementById("sms-input").disabled = false;
//如果时间等于0秒的话,那就删除定时器
window.clearInterval(InterValOjb);
}else{
tiem --;
$("#sms-input").val(tiem+"秒");
}
}
//把按钮隐藏30s的效果
function SendSMS() {
//获取手机号，使用正则表达式来验证手机号的正确与否
var phone = $("#phone").val();
if((/^1(3|4|5|6|7|8|9)\d{9}$/.test(phone))){
//发送Ajax请求 这里虽然会显示错误，但是不会影响程序的运行
$.post([[@{~/userController/sms}]],{"smsphone":phone},function (data) {
//如果该手机号已被注册过的话那就不能注册了
if(data.message == false){
layer.msg("该手机号已被注册");
return false;
}else{
//把回调函数的结果 赋值给这个公共变量
sms = data.sms;
layer.msg("验证码发送成功,请注意查收");
//把用户输入的手机号 添加到隐藏表单手机号
$("#sms_userName").val(phone);
}
},"json");
//设置按钮的只读属性
$("#sms-input").attr("disabled","true");
//每隔一千毫秒(1秒)就调用一次这个timer方法
InterValOjb = window.setInterval(timer,1000);
}else{
layer.msg("手机格式有误");
return false;
}
}
//验证码的离焦事件（失去焦点） 判断密码是否正确
$("#sms-code").blur(function () {
//获取用户输入的验证码
var code = $("#sms-code").val();
//获取真正的验证码
// 第一种方法(有误):
// 第一次是获取不到值的 因为使用thymeleaf模板引擎第一次进入这个页面它会自动渲染，（所以得到的结果就是null）
// 但是你的离焦事件启动完了之后就会有值，只要你再次刷新页面(重新渲染)那么就会又有值了
//var sms = [[${session.sms}]];
//第二种方法
if(code == sms){
layer.msg("验证码正确");
$("#applyBtn").attr("disabled",null);
}else{
layer.msg("验证码输入有误,请重新输入");
$("#applyBtn").attr("disabled","disabled");
return;
}
});
</script>
</body>
</html>
4_1_2、登录页面
登录页面代码(HTML和自己写的Js)
<!doctype html>
<!-- 引入templates的命名空间 xmlns:th="http://www.thymeleaf.org" -->
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="css/bootstrap.min.css" type="text/css" rel="stylesheet" th:href="@{/css/bootstrap.min.css}" >
<link href="css/font-awesome.min.css" type="text/javascript" rel="stylesheet" th:href="@{/css/font-awesome.min.css}">
<link href="css/bootsnav.css" type="text/css" rel="stylesheet" th:href="@{/css/bootsnav.css}">
<link href="css/normalize.css" type="text/css" rel="stylesheet" th:href="@{/css/normalize.css}">
<link href="css/css.css" rel="stylesheet" type="text/css" th:href="@{/css/css.css}">
<script src="js/jquery-1.11.0.min.js" type="text/javascript" th:src="@{/js/jquery-1.11.0.min.js}"></script>
<script src="js/jquery.step.js" th:src="@{/js/jquery.step.js}"></script>
<script src="js/bootstrap.min.js" type="text/javascript" th:src="@{/js/bootstrap.min.js}"></script>
<script src="js/bootsnav.js" type="text/javascript" th:src="@{/js/bootsnav.js}"></script>
<script src="js/jquery.js" type="text/javascript" th:src="@{/js/jquery.js}"></script>
<!--[if IE]>
<script src="js/html5.js"></script><![endif]-->
<title>注册</title>
</head>
<body class="logobg_style">
<div id="large-header" class="large-header login-page">
<canvas id="demo-canvas" width="1590" height="711"></canvas>
<div class="Retrieve_style">
<div class="Retrieve-content step-body" id="myStep">
<h1 class="title_name">用户注册</h1>
<div class="step-header">
<ul>
<li><p>输入电话</p></li>
<li><p>确认密码</p></li>
<li><p>成功</p></li>
</ul>
</div>
<div class="step-content">
<div class="step-list login_padding">
<!-- 大表单 -->
<form role="form" id="form_login" class="">
<div class="form-group clearfix">
<div class="input-group col-lg-8 col-md-8 col-xs-8">
<div class="input-group-addon"><i class="icon_phone"></i></div>
<!-- 输入的手机号的框 -->
<input type="text" class="form-control text_phone" name="phone" id="phone"
placeholder="你的手机号" autocomplete="off">
</div>
<!-- 获取验证码的按钮 -->
<div class="col-lg-4 col-md-4 col-xs-4 fl"><input type="button" id="sms-input" class="btn_mfyzm"
value="获取验证码" onclick="SendSMS()"/>
</div>
</div>
<div class="form-group clearfix">
<div class="input-group">
<div class="input-group-addon"><i class="icon_yanzhen"></i></div>
<!-- 输入短信验证码的框 -->
<input type="text" class="form-control" name="Verification" id="sms-code"
placeholder="短信验证码" autocomplete="off">
</div>
</div>
<div class="tishi"></div>
</form>
<div class="form-group">
<!-- 下一步按钮 disabled="disabled" 如果没输入手机号和验证码是不允许点击的 -->
<button class="btn btn-danger btn-block btn-login" id="applyBtn" disabled="disabled" >下一步</button>
</div>
</div>
<div class="step-list">
<form method="post" role="form" id="" class="login_padding">
<div class="form-group clearfix">
<div class="input-group">
<div class="input-group-addon">
<i class="icon_password"></i>
</div>
<!-- 第一个密码框 -->
<input type="password" class="form-control" name="password" id="password"
placeholder="输入密码" autocomplete="off">
</div>
</div>
<div class="form-group clearfix">
<div class="input-group">
<div class="input-group-addon">
<i class="icon_password"></i>
</div>
<!-- 第二个密码框 -->
<input type="password" class="form-control" name="confirmpwd" id="confirmpwd"
placeholder="再次密码" autocomplete="off">
</div>
</div>
<div class="tishis"></div>
<div class="form-group">
<a href="javascript:void(0);" type="submit" class="btn btn-danger btn-block btn-login"
id="submitBtn">注册</a>
</div>
</form>
</div>
<div class="step-list">
<div class="ok_style center">
<h2><img src="images/ok.png" th:src="@{/images/ok.png}"></h2>
<!-- 写一个定时器的效果（倒计时的效果）已完成在jquery.step.js下的28行-->
<h5 class="color2 mtb20">你已成功注册会员<b id="Os">5</b>秒后跳转到首页</h5>
</div>
</div>
<!-- 自己写一个隐藏表单 -->
<form hidden id="sms_form" th:action="@{/userController/register}" method="post">
<input id="sms_userName" name="phone"/>
<input id="sms_password" name="password"/>
</form>
</div>
</div>
</div>
</div>
<script src="js/TweenLite/TweenLite.min.js" th:src="@{/js/TweenLite/TweenLite.min.js}"></script>
<script src="js/TweenLite/EasePack.min.js" th:src="@{/js/TweenLite/EasePack.min.js}"></script>
<script src="js/TweenLite/rAF.js" th:src="@{/js/TweenLite/rAF.js}"></script>
<script src="js/TweenLite/demo-1.js" th:src="@{/js/TweenLite/demo-1.js}"></script>
<!-- 引入layer js (这个脚本主要是做弹出层的效果)很不错-->
<script src="js/layer/layer.js" th:src="@{/js/layer/layer.js}"></script>
<!-- th:inline="javascript" 可以在javascript使用thymeleaf语法 -->
<script type="text/javascript" th:inline="javascript">
var tiem = 5;
var InterValOjb;
//用于存储 回调函数的返回值
var sms;
function timer() {
if(tiem == 0){
$("#sms-input").val("重新获取验证码");
//为什么要在这里设置为又把tiem设置为5呢？
// 原因就是为下一次点击按钮做准备，如果下一次点击按钮那就是等于5了，就会走else了，
//然后这样不断的循环，只要有人点按钮就会触发这个事件
tiem = 5;
//点击完一次在设置为false 这里使用原生的Jquery
document.getElementById("sms-input").disabled = false;
//如果时间等于0秒的话,那就删除定时器
window.clearInterval(InterValOjb);
}else{
tiem --;
$("#sms-input").val(tiem+"秒");
}
}
//把按钮隐藏30s的效果
function SendSMS() {
//获取手机号，使用正则表达式来验证手机号的正确与否
var phone = $("#phone").val();
if((/^1(3|4|5|6|7|8|9)\d{9}$/.test(phone))){
//发送Ajax请求 这里虽然会显示错误，但是不会影响程序的运行
$.post([[@{~/userController/sms}]],{"smsphone":phone},function (data) {
//如果该手机号已被注册过的话那就不能注册了
if(data.message == false){
layer.msg("该手机号已被注册");
return false;
}else{
//把回调函数的结果 赋值给这个公共变量
sms = data.sms;
layer.msg("验证码发送成功,请注意查收");
//把用户输入的手机号 添加到隐藏表单手机号
$("#sms_userName").val(phone);
}
},"json");
//设置按钮的只读属性
$("#sms-input").attr("disabled","true");
//每隔一千毫秒(1秒)就调用一次这个timer方法
InterValOjb = window.setInterval(timer,1000);
}else{
layer.msg("手机格式有误");
return false;
}
}
//验证码的离焦事件（失去焦点） 判断密码是否正确
$("#sms-code").blur(function () {
//获取用户输入的验证码
var code = $("#sms-code").val();
//获取真正的验证码
// 第一种方法(有误):
// 第一次是获取不到值的 因为使用thymeleaf模板引擎第一次进入这个页面它会自动渲染，（所以得到的结果就是null）
// 但是你的离焦事件启动完了之后就会有值，只要你再次刷新页面(重新渲染)那么就会又有值了
//var sms = [[${session.sms}]];
//第二种方法
if(code == sms){
layer.msg("验证码正确");
$("#applyBtn").attr("disabled",null);
}else{
layer.msg("验证码输入有误,请重新输入");
$("#applyBtn").attr("disabled","disabled");
return;
}
});
</script>
</body>
</html>
4_2、CSS
这个没什么好说的，就是下载的网页的模板自带的
4_3、JS
绝大部分使用的是模板自带的
也有部分自己写的
var step = $("#myStep").step({
animate: true,
initStep: 1,
speed: 1000
});
$("#preBtn").click(function (event) {
var yes = step.preStep();
});
$("#applyBtn").click(function (event) {
var code = $.trim($("#Verification").val());
var phone = /[1][3-9][0-9]{9,9}/;
var phones = $.trim($("#phone").val());
if ($.trim(phones) == "") {
Tip('请填写手机号码！');
$("#phone").focus();
return;
}
var yes = step.nextStep();
return;
});
$("#submitBtn").click(function (event) {
var txtconfirm = $.trim($("#confirmpwd").val());
var txtPwd = $("#password").val();
if ($.trim(txtPwd) == "") {
layer.msg("请输入你要设置的密码！");
$("#txtPwd").focus();
return;
}
if ($.trim(txtconfirm) == "") {
layer.msg("请再次输入密码！");
$("#txtconfirm").focus();
return;
}
if ($.trim(txtconfirm) != $.trim(txtPwd)) {
layer.msg("你输入的密码不匹配，请从新输入！");
$("#txtconfirm").focus();
return;
}
// (如果两次输入的是正确的)
$("#sms_password").val(txtconfirm);
//倒计时效果
var Os=document.getElementById("Os");
var num=5;
var timer=setInterval(function () {
num--;
Os.innerText=num;
if(num==0){
clearInterval(timer);
window.location.href="/indexController/index";
//5秒过后才会提交隐藏表单 到数据库
$("#sms_form").submit();
}
},1000)
var yes = step.nextStep();
$(function () {
setTimeout("lazyGo();", 1000);
});
function lazyGo() {
var sec = $("#sec").text();
$("#sec").text(--sec);
if (sec > 0)
setTimeout("lazyGo();", 1000);
else
window.location.href = "article_home.html";
}
});
5、遇到的困难
- 大意
- 因为写Dao层的测试连接嘛,然后各种报错,原因很简单 连接的数据库不对，但是呢不同的数据库又有相同的数据表，因为我写的实体类是UserInfo嘛,然后另外一个数据库的表也是UserInfo 然后呢，我连接的是第二个数据库
但是我写的实体类呢又是第一个数据库的,所以就导致冲突了。 哈哈，很尴尬，我一直查找出错的地方,没想到竟然是数据库的连接信息写错了。哈哈，这让我明白了一个道理,写代码，一定要细心
至于其他的倒也没了
6、总结OR收获
- 先说收获吧
感觉让自己对SpringBoot的理解加深了一点，对templates语法也有一些其他的认知吧，也同时对SSM的加深与巩固 - 比如就是对下载好的模板的处理，Js的加深(其实脚本也挺好玩的)，对隐藏表单的使用，对短信的发送也有了一定的理解吧
- 总结
虽然这只是一个小的登录案例 但是呢，也让自己对自己有了一个认知吧。知道自己哪里缺什么，该学什么，
最后加油吧少年
加油吧！少年
浙公网安备 33010602011771号