做个用户管理系统(27)——修改登录密码【20201215】

发表于 2020-12-15 10:51:31
阅读 46

介绍

介绍

福哥今天要带着大家完成TFUMS系统的修改登录密码功能。修改登录密码功能相对比较简单,一般网站会直接让登录用户随便改登录密码,这样存在一个问题,就是当用户登录后离开电脑,“陌生人”操作电脑修改了登录密码,用户回来后发现无法登录就尴尬了!

福哥为了避免这个问题,在修改登录密码的时候要求操作者(也可能不是用户本人)提高当前的登录密码,如果是用户本人肯定是知道的,如果不是那么一般情况下他也不知道当前的登录密码,也就不能完成修改登录密码的操作了。

模型user

passwd

public function passwd(int $userID, string $currPwd, string $newPwd):int {
    $tfdo = $this->tfphp->getDatabase()->getTFDO();

    $userInfo = $this->getByTable("user", array($userID));
    if($userInfo == null){

        return 1;
    }

    if($userInfo['passwd'] != md5($currPwd)){

        return 2;
    }

    $ret = $tfdo->update("user", array(
        'passwd'=>md5($newPwd)
    ), null, "userID = @int", array(
        $userID
    ));
    if(!$ret){

        return 3;
    }

    return 0;
}

接口控制器

user_process

protected function user_process(){
    $req = $this->tfphp->getRequest();
    $post = $req->post;
    $user = new user($this->tfphp);
    $opass = $post->get("opass");
    $npass = $post->get("npass");
    $cpass = $post->get("cpass");

    try{
        // request test
        if($opass == "" || $npass == "" || $cpass == ""){

            return $this->tfphp->getResponse()->responseJSON_CM(200, 1001051, "错误请求");
        }
        if($npass != $cpass){

            return $this->tfphp->getResponse()->responseJSON_CM(200, 1001051, "两次输入的新密码不一样");
        }

        // create user
        $ret = $user->passwd($this->permission->getLoginStatus()->userID,
            $opass, $cpass);
        switch ($ret){
            case 1:
                return $this->tfphp->getResponse()->responseJSON_CM(200, 1001052, "用户名不存在");
                break;
            case 2:
                return $this->tfphp->getResponse()->responseJSON_CM(200, 1001053, "当前密码错误");
                break;
            case 3:
                return $this->tfphp->getResponse()->responseJSON_CM(200, 1001054, "修改密码失败");
                break;
        }
    }
    catch(\TypeError $e){

        return $this->tfphp->getResponse()->responseJSON_CM(200, 1001051, "错误请求");
    }

    // output
    return $this->tfphp->getResponse()->responseJSON_CM(200, 0, "OK");
}

视图模板

HTML代码

<!-- passwd form begin -->
<div class="row login-form">
    <div class="col-sm-12">
        <h3 class="text-center">修改密码</h3>
        <p>请输入当前使用的密码,才能修改新密码</p>
        <form>
            <div class="form-group">
                <label>当前密码</label>
                <input class="form-control" type="password" name="opass" />
            </div>
            <div class="form-group">
                <label>新密码</label>
                <input class="form-control" type="password" name="npass" />
            </div>
            <div class="form-group">
                <label>新确认密码</label>
                <input class="form-control" type="password" name="cpass" />
            </div>
            <div class="form-group">
                <button class="btn btn-primary btn-sm form-control">修改密码</button>
            </div>
        </form>
    </div>
</div>
<!-- passwd form end -->

JS代码

$('form').form({
    url: "<% $TFReq->server->BASE_URI %>api/member/passwd",
    method: "post",
    validations: [
        {type:"empty", name:"opass", msg:"请填写当前密码"},
        {type:"empty", name:"npass", msg:"请填写新密码"},
        {type:"min", value:6, name:"npass", msg:"新密码最少6个字"},
        {type:"empty", name:"cpass", msg:"请填写新确认密码"}
    ],
    onSuccess: function (d) {
        if(d.errcode == 0){
            document.location = '<% $TFReq->server->BASE_URI %>member/';
        }
        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

passwd

首先检查用户是否存在,不存在就报错。

接着判断当前密码是否正确,相当于进行了一次身份校验。

如果一起都对的上,就更新用户的登录密码。

接口控制器

user_process

这里先检查表单数据是否正确,然后特别对新密码和新确认密码进行了校验,避免用户自己弄错了新密码。

最后调用模型user的passwd进行密码修改操作。

视图模板

HTML代码

这个表单有三个密码输入框,分别是opass(old)、npass(new)、cpass(confirm)。

JS代码

这是一个使用form控件驱动的标准表单处理程序,没什么可说的了,大家都熟悉了。

效果

72a3992c7aa19a83.jpg

总结

今天福哥带着童鞋们实现了TFUMS系统的修改登录密码功能,这个功能属于一个很标准的表单,不需要表单数据载入,也不需要验证码,算是很简单的一个功能了。

下一课福哥将带着童鞋们开始完成安全问题表单的功能了。