介绍
介绍
福哥今天要带着大家完成TFUMS系统的忘记密码功能地第二步——身份验证方式选择的开发。身份验证方式指的是我们要确定这个“忘记密码”的人是不是账号的所有人,既然他不知道密码就只能通过其他方式验证了。
前面我们有要求用户设置绑定邮箱,绑定邮箱是账号所有人的私有邮箱,如果“忘记密码”的人可以收到寄到绑定邮箱里的邮件,则证明他就是账号的所有人了。
除了绑定邮箱之外,我们还让用户设置了安全问题,这个安全问题的答案只有账号的所有人知道,如果他能全部答对,则证明他就是账号的所有人了。
模型user
forgotWay
public function forgotWay(string $data):?array {
$myAES = new TFAES($this->tfphp);
$userInfoData = $myAES->decrypt($data, TFConfig::get("projectAESPK", "system"). date("YmdH0000"), "");
$userInfo = unserialize($userInfoData);
if(is_array($userInfo)){
return $userInfo;
}
return null;
}接口控制器
doList
private function doList(){
$user = new user($this->tfphp);
$data = $this->tfphp->getRequest()->get->sn;
// check data
$userInfo = $user->forgotWay($data);
if($userInfo == null){
return null;
}
// get states
$securityStates = $user->getSecurityStates($userInfo['userID']);
return $this->tfphp->getResponse()->responseJSON(200, $securityStates);
}doSelect
private function doSelect(){
$get = $this->tfphp->getRequest()->get;
$data = $get->sn;
$way = $get->way;
// select
if($way == "email"){
$url = "forgotByEmail.htm?sn=". $data;
}
else{
$url = "forgotBySecurityQuestions.htm?sn=". $data;
}
return $this->tfphp->getResponse()->responseJSON_CM(200, 0, "OK", array(
'url'=>$url
));
}视图模板
HTML代码
<!-- forgot form begin --> <div class="row login-form"> <div class="col-sm-12"> <h3 class="text-center">忘记密码</h3> <p>请选择一个验证方式,通过它来证明您是该用户的所有者</p> <form action="resetPassByQuestion.htm"> <div class="form-group" id="way-email" style="display: none"> <label> <input type="radio" name="way" value="email" /> 通过绑定邮箱验证 </label> </div> <div class="form-group" id="way-question" style="display: none"> <label> <input type="radio" name="way" value="question" /> 通过安全问题验证 </label> </div> <div class="form-group"> <button class="btn btn-primary btn-sm form-control">下一步</button> <div class="text-center"> <a href="JavaScript:void(0)" onclick="history.go(-1)">上一步</a> </div> </div> </form> </div> </div> <!-- forgot form end -->
JS代码
// load
$.get("<% $TFReq->server->BASE_URI %>api/member/forgotWay/_list", {sn:"<% $TFReq->get->sn %>"}, function (d) {
if(d.bindEmail){
$('#way-email').show();
}
if(d.securityQuestions){
$('#way-question').show();
}
},"json");
// form
$('form').form({
url: "api/member/forgotWay/_select?sn=<% $TFReq->get->sn %>",
method: "post",
validations: [
{type:"empty", name:"way", msg:"请选择验证方式"},
],
onSuccess: function (d) {
if(d.errcode == 0){
document.location = '<% $TFReq->server->BASE_URI %>'+d.url;
}
else{
$('form').tips({
text:d.errmsg
});
}
},
onError: function (d) {
$('form').tips({
text:"服务器响应错误"
});
},
onValidationError: function (form, name, msg) {
$('form').tips({
text:msg
});
$('form').find('[name="'+ name +'"]').focus();
}
});讲解
模型user
forgotWay
这个方法就是用来解密前面用forgot加密的用户数据的,里面包含了用户信息。
接口控制器
doList
首先使用forgotWay得到用户的ID。
然后使用用户ID获得可用的安全验证方式信息。
doSelect
根据表单参数返回忘记密码下一步的页面URL地址。
视图模板
HTML代码
将两种验证方式选项都列出来,默认是隐藏的,根据list返回的安全验证方式信息将可用的选项显示出来。
JS代码
首先通过AJAX请求list接口,获得可用的安全验证方式信息,根据这些安全验证信息将对应的选项显示出来。
效果

总结
福哥今天带着童鞋们完成了TFUMS系统的忘记密码的第二步——安全验证方式选择的开发。功能逻辑比较简单,且没有数据库操作,大家应该很容易理解了。
下一课,福哥将带着大家开发通过绑定邮箱重置密码的功能了。