介绍

介绍

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

下一课，福哥将带着大家开发通过绑定邮箱重置密码的功能了。