springboot及mybatis的应用-注册登录系统,附源码(idea 2021版本)

springboot及mybatis的应用-注册登录系统,附源码(idea 2021版本)

IDE 是idea 2021

相关功能实现详细流程:

一、需求介绍

通过对Servlet、Session、Cookie和Filter知识的学习,进行程序设计,完成以下功能

1设计验证码,控制登录

通过设计程序,完成由4位数字或字母以及多个干扰点共同构成的验证码的生成,并将生成的验证码在登陆界面显示,设计服务器端程序,在用户登录时,先对用户输入的验证码进行验证,实现对用户登录过程的控制

2使用mybatis框架获取用户信息

设计程序获取用户输入的登录信息通过,通过mybatis框架访问数据库,根据用户提交的用户名,查询数据库中是否有此用户,并将对应的用户密码与用户提交的密码进行比对,根据比对结果为用户返回不同结果提示界面,完成对登录信息的验证过程。

3运用springboot框架进行登录控制

设计程序,在用户登陆时使用springboot的传参语句,对用户输入的不同登录信息,调用service层的服务方法,进行结果配置,控制登录过程。用户可选择是否需要执行自动登录,提供单选框。通过springboot框架和js脚本实现,在用户选择自动登录后,用户即使退出浏览器,下一次打开项目工程界面时能完成自动登陆操作,若用户未选择自动登录,则下一次访问项目时,系统返回登录界面。

4使用springboot和mybatis框架,实现注册功能

设计用户注册窗口,并对用户提交的注册信息进行验证,使用mybatis框架将用户输入的合法注册信息,通过service层的服务,添加到数据库中,通过springboot框架的Model依据对用户提供的注册信息的验证结果,返回结果对应的界面。

5使用springboot和mybatis框架,实现找回密码功能

设计用户找回密码窗口,并对用户提交的密码和二次密码信息进行验证,使用mybatis框架将用户输入的合法信息,通过service层的服务,更新到数据库中,通过springboot框架的Model依据对用户提供的密码与二次密码信息的验证结果,返回结果对应的界面。

二、技术描述

1自动生成验证码

将自动生成验证码的方法作为service类的一个方法,该类继承ActionSupport 类作为生成验证码时执行的action。

1.1设置验证码内容

设计方法,预设一个字符串存储从0-9的数字以及小写的英文字母,通过Random类的random.nextInt()方法以及String类中的+方法,从预设的字符串中随机取出4个字符用来构成验证码的内容。如图2-1所示。

图2-1 生成验证码

1.2绘制验证码背景以及干扰

(1)绘制验证码背景

通过实例化一个Graphics类的对象g,获得用于画验证码的画笔,并通过setColor()和fillRect()方法设置背景颜色,并在方法执行至此时,将验证码的背景填充为预设颜色。如图2-2所示。

图2-2 绘制验证码背景

(2)绘制验证码干扰点

通过循环的方式像图中设置200个干扰点,通过random()方法每次随机从图像中过获取一个位置,并随机为Graphics对象设置一个颜色,最终使用drawOval()方法将点绘制出来。如图2-3所示。

图2-3 绘制验证码干扰点

1.3绘制验证码内容

使用Graphics对象的setColor()方法以及setFont()方法对生成好的验证码内容进行颜色以及字体的设置,通过drawString()方法以及charAt()方法将验证码内容读取入Graphics对象并在不同高度和位置将验证码内容绘制进验证码主体。如图2-4所示。

图2-4 绘制验证码内容

1.4生成base64格式的验证码图片

并通过上述方法设置背景以及生成验证码以及干扰点后生成完整的验证码图片再转化为base64格式。如图2-5所示。

图2-5 生成验证码图片

1.5将验证码存储入Model

将验证码和验证码图片存储入springboot框架的Model里面,更方便于在前端显示验证码。如图2-6所示。

图2-6 将验证码存入Model

1.6点击验证码图片进行刷新

设计验证码刷新类实现清除旧的验证码并将新的验证码存人session并将新的验证码图片存入Model。如图2-7所示。

图2-7 验证码刷新类

设计验证码刷新脚本实现点击验证码图片后可以触发验证码刷新类的刷新方法,并将新的验证码图片更新至前端界面。

图2-8 验证码刷新js脚本

2登录业务

关于登录验证的控制层设计了DengLuController实现有关登录页面的控制,其中的方法控制的有:从主界面跳转至登录界面,在登录界面填写表单后进行验证,从登录界面跳转至修改密码界面,取消自动登录并从登录成功界面跳转至登录界面。

2.1登录验证

由用户提交账号,密码和验证码表单后,后端通过springboot框架获得提交的账号,密码和验证码,通过service中的账号存在校验,账号密码校验方法来进行校验业务,对于验证码校验需要先从session中取出正确验证码与用户输入的验证码比较进行校验,所有数据校验成功后跳转至登录成功界面。如图2-9所示。

图2-9 登录验证控制类

2.2自动登录

在登录控制类中登录验证方法存在传递自动登录勾选框状态的参数。默认值为false。如图2-10所示。

图2-10 勾选框参数

(1)第一次登录

若自动登录勾选框的状态为被勾选时,如果登录时用户提交的账号,密码和验证码都是正确的,那么将用户输入的账号和密码存入session。如图2-11所示。

图2-11 存储账号密码入session

(2)后续登录

在主界面跳转至登录界面的控制方法中,先从session中取出username的值,再判断该值是否为空,如果不为空则再从session中取出password的值,进行账号密码校验,校验成功后不必跳转至登录界面而是直接跳转至登录成功界面。如图2-12所示。

图2-12 自动登录校验

(3)取消自动登录

在第二次登录后登录成功界面会显示一个取消自动登录?的可点击文字,点击后即可清除session中保存的username和password。并跳转至登录界面。如图2-13所示。

图2-13 取消自动登录

3注册业务

注册业务控制层设计了ZhuCeController,其中包括了从主界面跳转至注册界面,和用户提交表单后进行数据校验并注册的控制方法。

3.1从主界面跳转至注册界面

需要额外清除注册失败的一些失败原因session。如图2-14所示。

图2-14 跳转至注册界面

3.2注册数据校验及将用户信息存入数据

对用户提交的用户名,密码和二次密码进行校验。判断用户名是否已存在,判断密码和二次密码是否一致,调用service中的校验方法进行校验。如图2-15所示。

图2-15 注册校验

4找回密码业务

找回密码业务控制层设计了ZhaoHuiMiMaController控制类,其中包括了跳转至找回密码界面和找回密码数据校验控制方法。

4.1跳转至找回密码界面

需要先清理在由于密码错误而登录失败时存入session的错误信息。如图2-16所示。

图2-16 找回密码跳转方法

4.2数据校验

对输入的账号判断是否注册,对输入的密码和二次密码进行校验,验证完成后更新数据库中的数据。如图2-17所示。

图2-17 找回密码数据校验

5用户界面设计

主要设计了主界面、登录界面、注册界面、找回密码界面、登录成功界面、注册成功界面和修改密码成功界面。

5.1主界面

主界面为用户提供了登录和注册俩个按钮供点击,如图2-18所示。

图2-18 主界面效果图

5.2登录界面

登录界面为用户提供了找回密码、输入账号、输入密码、输入验证码、更新验证码、返回和确认并提交表单功能。如图2-19所示。

图2-19 登录界面效果图

5.3注册界面

注册界面为用户提供了输入账号、输入密码和二次输入密码功能。如图2-20所示。

图2-20 注册界面效果图

5.4找回密码界面

找回密码界面为用户提供了输入账号、输入密码和确认密码功能。如图2-21所示。


图2-21 找回密码界面效果图

5.5登录成功界面

登录成功界面分为俩个,一个是普通登录成功,一个是自动登录成功,自动登录成功界面多了一个取消自动登录的可点击文字,点击后取消自动登录。如图2-22和图2-23所示。

(1)普通登录成功界面

图2-22 普通登录成功界面效果图

(2)自动登录成功界面

图2-23 自动登录成功界面效果图

5.6注册成功界面

注册成功界面有一段去登录可点击文字,点击后跳转至登录界面。效果图如图2-24所示。

图2-24 注册成功界面效果图

5.7修改密码成功界面

修改密码成功界面有一段去登录可点击文字,点击后跳转至登录界面。效果图如图2-25所示。

图2-25 修改密码成功界面效果图

三、成果展示

1注册功能

注册功能主要展示:注册成功效果,以及三种注册失败效果。注册功能的输入信息界面如图3-1所示。

图3-1 输入信息界面

1.1注册成功

(1)输入账号、密码和确认密码。注册前数据库如图3-2所示。

图3-2 注册前数据库中数据

(2)注册成功后数据变化。注册后数据库如图3-3所示。

图3-3 注册后数据库中数据

1.2注册失败

注册失败主要有输入账号为空、账号已存在和二次输入密码错误三种情况。

(1)输入账号为空

当用户输入账号是空的时候,系统返回注册界面,并提示错误原因。如图3-4所示。

图3-4 因输入账号为空注册失败

(2)账号已存在

当用户输入的账号已经存在时,系统返回注册界面,并提示错误原因。如图3-5所示。

图3-5 因账号已存在注册失败

(3)确认密码错误

当用户二次输入的密码与第一次不符合时,系统返回注册界面,并提示错误原因。如图3-6所示。

图3-6 因确认密码错误注册失败

2登录功能

登录功能主要展示登录成功、自动登录和三种登录失败原因。登录界面输入信息如图3-7所示。

图3-7 输入信息界面

2.1登录成功

输入账号、密码和验证码,并均可校验通过时跳转至登录成功界面。如图3-8所示。

图3-8 登录成功界面

2.2自动登录

自动登录功能需要在登录界面勾选自动登录的勾选框。如图3-9所示。

图3-9 自动登录填写信息界面

(1)第二次登录

在勾选自动登录勾选框后登录完成一次后,第二次登录即可不必填写账号密码,可直接跳转至登录成功界面。如图3-10和图3-11和图3-12所示。

图3-10 第一次登录成功

图3-11 访问主界面

图3-12 第二次登录成功

(2)取消自动登录

在第二次登录成功或以后通过自动登录而登录成功的成功界面取消自动登录可点击文字,点击后便取消自动登录。如图3-13和图3-14所示。

图3-13 第二次登录成功

图3-14 已取消自动登录

2.3登录失败

登录失败主要有账号未注册、账号密码校验错误和验证码错误三种情况。

(1)账号未注册

当用户输入账号未注册的时候,系统返回登录界面,并提示错误原因,并更新验证码。如图3-15所示。

图3-15 账号未注册登录失败

3找回密码

找回密码界面需要输入账号、密码和二次输入密码。如图3-16所示。

图3-16 找回密码输入信息

3.1找回密码成功

当输入账号已注册并且二次输入密码正确时将更新数据中的密码。

(1)找回前数据库

用户在找回前数据库中的数据如图3-17所示。

图3-17 找回前数据库

(2)找回后数据库

用户在找回密码后数据库中的数据如图3-18所示。

图3-18 找回后数据库

3.2找回密码失败

找回密码失败原因主要有账号未注册和确认密码失败。

(1)账号未注册

当输入的账号没有经过注册,则会返回找回密码界面并提示错误信息。如图3-19所示。

图3-19 账号未注册导致找回密码失败

(2)确认密码失败

当输入的密码和二次输入的密码不一致时,则会返回找回密码界面并提示错误信息。如图3-20所示。

图3-20 确认密码错误导致找回密码失败

链接:https://pan.baidu.com/s/1EmFFZsXzsv2L5u9Mfjq7yw 
提取码:yo0d

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值