- 需求
- MySQL表
- 实现方案
- index页面
- home页面
需求
实现一个登录功能
实现的功能
-
注册(邮箱注册) -
登录(邮箱+密码) -
重置密码 -
查看操作记录(登录, 注册, 重置密码, 登出. 都算操作) -
登出
在第一版的基础上进行优化:\
优化点:
-
存操作信息
请求的post使用中间件进行储存操作信息.避免重复代码
因为除了查询操作不需要存入 OperationRecord(操作列表)外,其他操作都要存入操作列表,当用户提交注册,登录,重置密码,登出等操作时就将用户的操作信息存入OperationRecord(操作列表)中,避免重复代码.
-
验证码:
(1)验证码的储存:
为了数据安全,必须严格核验验证码的准确性,所以验证码不能单独生成,必须与申请验证码信息的账号相关,通过账号储存验证码信息,在核验的时候也不能单独核验,上传验证码的账号必须与生成验证码的账号相同,避免在提交验证码时用户恶意篡改邮箱信息.
-
验证码储存:存map["Email"]验证码(int),再定义一个删除时间,在核验的时候需要key与value都相同 -
或者存MySQL
名称 | 数据类型 |
---|---|
string | |
验证码 | int |
核验的时候也使用Email查询验证码核验,到一定时间删除MySQL数据
(2)验证码时效
验证码生成后设计5分钟内验证码未使用就从列表中删除了,5分钟后用户填写验证码即为无效验证,需要重新获取验证码,但是如果申请验证码的用户未进行任何验证,错误与正确验证都没有,那么重新发送的验证码将与原验证码相同,否则发送的验证码将与原验证码不同.避免某些用户在5分钟内没法收到验证码的情况.
(3)操作与验证分离式
-
用到验证码只有登录 ,改密与注册,可以进行先获取权限,后执行操作(先验证邮箱,锁定邮箱,避免验证后用户又进行更改,再改密或者注册就只能是刚刚注册的邮箱)
(一). 邮箱验证(先)
名称 | 数据类型 |
---|---|
string | |
验证码 | int |
(二). 注册/改密(后)(登录没有后续操作)
改密
新密码 | string |
again | string |
注册
name | string |
密码 | string |
-
id主键
主键自增:
用自增长整数代替随机数避免重复:使用整数作为主键,每插入一条新记录,主键自动加一。这种方式不会产生重复的主键,而且速度快,但无法在分布式环境下使用。
-
真人验证:
为避免机器人攻击网站,恶意刷邮件等操作,在登录,改密,注册等关键性节点加上真人验证环节.
我们选择
滑动验证:滑块验证是一种常见的验证方法,要求用户在滑块上进行拖动操作,以证明他们是真人而不是机器人。这种验证方法通常易于使用,因为它不需要用户输入文本或解决问题,但仍然可以提供相对高的安全性。
-
保持登录状态
由于服务器与用户的数据交互不是连续的,我们只能从SignInList(登录列表)判断用户是否在线,无法判断用户是否掉线,所以我们给SignInList(登录列表)中的数据增加一个时效(30分钟),如果30分钟之内用户无任何操作则视为掉线,服务端将删除SignInList(登录列表)中对应用户的数据,当用户30分钟后再次访问时就需要重新登陆.如果在30分钟之内用户有操作,则重新计算30分钟时间(从0开始).
MySQL表
-
LoginList(注册列表)
名称 | 数据类型 |
---|---|
id(主键) | int |
name(唯一) | string |
password | string |
Email(唯一) | string |
-
SignInList(登录列表)
名称 | 数据类型 |
---|---|
id (主键) | int |
身份码 | int |
-
OperationRecord(操作列表)
名称 | 数据类型 |
---|---|
id | int |
操作 | string |
time | string |
-
VerificationCode(验证码储存库)
名称 | 数据类型 |
---|---|
Email(唯一) | string |
Verification | int |
实现方案
index页面
/index
定义一个index页面包含两个按钮login(注册)和sign up(登录) 点击login进入注册页面,点击sign up进入登录页面
login(注册)
index/login
(1). 注册邮箱验证:
-
用户先填写注册邮箱(核验邮箱格式正确且未使用),点击发送验证码 -
弹出真人验证:滑动验证 -
生成验证码,与Email一起储存在VerificationCode(验证码储存库),并设计5分钟的删除时间,如果5分钟未验证,便该删除数据. -
向用户邮箱发送验证码 -
重新提交,如果验证码生成后,该用户未进行任何验证,则生成相同的验证码,并告知用户,如果之前有验证失败,就生成不同的验证码.避免某些用户在5分钟内没法收到验证码的情况. -
服务端使用用户的提交验证码时的Email去VerificationCode(验证码储存库)对比相对应的Verification(验证码值),进行验证. -
如果5分钟内都没有验证成功,就删除VerificationCode(验证码储存库)的对应数据,用户再次提交时生成新的验证码 -
如果发送验证码的用户30分钟内未进行任何验证,点击重新发送验证码,则生成与之前相同的验证码,避免某些用户在5分钟内没法收到验证码的情况.
(2)注册:
注册表单:
名称 | 数据类型 |
---|---|
name | string |
password | string |
-
先验证name是否有效与是否被使用(例如:name不能超过10个字符且字符都在ASCII中)
-
核验password是否规范(例如:大于6位小于20位) 确认没问题后
-
将用户数据(注册的Email,name,password)储存到LoginList(注册列表),并自增出一个新的ID
(5)通过id向OperationRecord(操作列表)中储存 "注册" 操作与目前的时间
sign up(登录)
index/signup
-
邮箱密码登录
账号密码登录表单:
名称 | 数据类型 |
---|---|
string | |
password | string |
(1). 用户填写表单信息,点击登录.
(2). 弹出真人验证:滑动验证
(3). 向服务端发送表单数据,服务端拿到表单数据去MySQL中查找,如果找不到对应的Email返回该邮箱未注册,请先注册,如果password错误返回密码错误,
(4). 核验成功,服务端随机生成一个临时的访问身份码,与id一起储存到MySQL中的SignInList(登录列表)中(时效30分钟,30分钟后删除),再将一份发送给用户,用户拿着此身份码进入home页面
(5). 通过id向OperationRecord(操作列表)中储存 "登录" 操作与目前的时间
-
验证码登录
验证码登录表单:
名称 | 数据类型 |
---|---|
string | |
验证码 | int |
(1). 用户填写Email,点击发送验证码,
(2). 弹出真人验证:滑动验证
(3). 向服务端发送Email数据,服务端拿到数据去MySQL中查找,如果找不到对应的Email返回该邮箱未注册,请先注册,如果存在就向邮箱发送一封验证邮件
(4). 用户填写验证邮件,点击登录,服务器会核验验证码的正确性,核验成功,服务端随机生成一个临时的访问身份码,与id一起储存到MySQL中的SignInList(登录列表)中,再将一份发送给用户,用户拿着此身份码进入home页面
(5)通过id向OperationRecord(操作列表)中储存 "登录" 操作与目前的时间
用户登出或者意外掉线,服务端会删除SignInList(登录列表)中Email对应的数据.
原理图
home页面
/home
-
定义三个按钮 sign out(登出),reset password(重置密码),view(查看操作记录)
sign out(登出)
home/signout
-
通过用户的Email,删除SignInList(登录列表)对应的数据. -
回到index页面
(3)通过id向OperationRecord(操作列表)中储存 "登出" 操作与目前的时间
reset password(重置密码)
home/resetpassword 两个按钮:旧密码改密|验证码改密
1. 旧密码密码改密
(1). 验证正常登录状态:(核验身份) 检验目前用户的id与身份码信息是否在MySQL中SignInList(登录列表)存在且正确,重置数据时效,(重置为30分钟,30分钟后删除)
-
核验身份失败,退回到index页面
旧密码改密表单:
名称 | 数据类型 |
---|---|
password | string |
new password | string |
new password again | string |
(2). 用户填写表单信息,点击提交.
(3). 弹出真人验证:滑动验证
(4). 向服务端发送表单数据,服务端拿到表单数据核验new password是否规范(例如:大于6位小于20位),
(5). 检验password again密码是否相同
(6). 核验成功,服务端修改MySQL中的 LoginList(注册列表)中对应的id下的password
(7)通过id向OperationRecord(操作列表)中储存 "改密" 操作与目前的时间
2. 验证码改密
(1). 验证正常登录状态:(核验身份) 检验目前用户的id与身份码信息是否在MySQL中SignInList(登录列表)存在且正确,重置数据时效,(重置为30分钟,30分钟后删除)
-
核验身份失败,退回到index页面
验证码改密表单:
名称 | 数据类型 |
---|---|
验证码 | int |
(1). 用户点击发送验证码,
(2). 弹出真人验证:滑动验证
(3). 服务器通过用户的id获取用户的Email信息,向Email发送一封验证邮件
(4). 用户点击提交,服务端核验验证码正确性(核验失败返回验证码错误),核验成功:修改MySQL中的 LoginList(注册列表)中对应的用户的id的password;
(5)通过id向OperationRecord(操作列表)中储存 "改密" 操作与目前的时间
查询操作记录
-
身份核验:
检验目前用户的id与身份码信息是否在MySQL中SignInList(登录列表)存在且正确,重置数据时效,(重置为30分钟,30分钟后删除) -
核验无误,服务端查询OperationRecord(操作列表)中的所有id为用户id的数据,并返回给用户
本文由 mdnice 多平台发布