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