关于react and desigin pro的用户登录模块简单笔记

react and desigin pro框架还是挺不错的。我用的是4.0版本，前几天用这个东西做了一个用户登录鉴权等功能模块。今天总结一下

启动 npm run start:no-mock  去除模拟数据，我这边直接用后台验证

 

找到登录页面：

src/pages/user/login/service.ts

我这边后台的逻辑是 (使用 thinkphp6.0)  主要看account方法即可。

<?php
namespace app\controller;

use app\BaseController;
use app\model;

use think\facade\Db;
use think\Request;

class Login extends BaseController
{

    public function checkToken($token)
    {

        $user = new model\admin;
        $userset = $user->field('id,time_out')->where('token', $token)->find();
        if (!empty($userset)) {

            if (time() - $userset['time_out'] > 0) {
                return 9001; //token长时间未使用而过期，需重新登陆
            }

            $new_time_out = time() + 604800; //604800是七天

            $data = ['token'=>$token,'time_out'=>$new_time_out];

            $res = $user->where(['id'=>$userset['id']])->save($data);

            if ($res) {
                return 0; //token验证成功，time_out刷新成功，可以获取接口信息
            }

        }

        return 9002; //token错误验证失败
    }

    public function index()
    {

        $user = new model\admin;
        $username = $this->request->param('username');
        $password = $this->request->param('password');

        $userisset = $user->where('username', $username)->find();
        if ($userisset == null) {
                $res["user"] = $username;
                $res["code"] = 400;
                $res["msg"] = "this user is not exist!";
                return ('{"user":"' . $username . '","code":"401","msg":"此用户不存在!"}');
        } else {

            $userpsisset = $user
                ->where('username', $username)
                ->where('password', md5(md5($password) . $userisset->salt))->find();
            if ($userpsisset == null) {
                return ('{"user":"' . $username . '","code":"401","msg":"密码错误"}');
            } else {
                $token = $this->makeToken();
                $time_out = strtotime("+7 days");
                $userpsisset->token = $token;
                $userpsisset->time_out = $time_out;
                $userpsisset->save();
                return  ('{"user":"' . $username . '","token":'.$token.' "code":"0","msg":"登录成功"}');
            }
        }
    }

    private function makeToken()
    {

        $str = md5(uniqid(md5(microtime(true)), true)); //生成一个不会重复的字符串
        $str = sha1($str); //加密
        return $str;
    }


    public function account(){

        $body = json_decode(file_get_contents('php://input'));
        $username = $body->userName;
        $password = $body->password;

        $user = new model\admin;

        $userisset = $user->where('username', $username)->find();
        if ($userisset == null) {
                $res["user"] = $username;
                $res["code"] = 400;
                $res["msg"] = "this user is not exist!";
                echo ('{"user":"' . $username . '","code":"401","msg":"此用户不存在!"}');
        } else {

            $userpsisset = $user
                ->where('username', $username)
                ->where('password', md5(md5($password) . $userisset->salt))->find();
            if ($userpsisset == null) {
                echo ('{"user":"' . $username . '","code":"401","msg":"密码错误"}');
            } else {
                $token = $this->makeToken();
                $time_out = strtotime("+7 days");
                $userpsisset->token = $token;
                $userpsisset->time_out = $time_out;
                $userpsisset->save();
                //{"status":"ok","type":"account","currentAuthority":"admin"}
                //'{"user":"' . $username . '","status":"ok","type":"account","currentAuthority":"'.$username.'","token":'.$token.' "code":"0","msg":"登录成功"}'

                $data["user"] = $username;
                $data["status"] = "ok";
                $data["type"] = "account";
                $data["currentAuthority"] = "admin";  //权限组 currentAuthority?: 'user' | 'guest' | 'admin';
                $data["token"] = $token;
                $data["code"] = 0;
                $data["msg"] = "success";
                $data["orgid"] = $userpsisset['org_id'];
                $data["userid"] = $userpsisset['id'];;

                echo  (json_encode($data));
            }
        }

    }
}

 

请求正确返回后，然后把token,或是org_id，在本地保存

src/pages/user/login/model.ts 文件，如图

 

 

保存了三个值:

localStorage.setItem('token',response.token);
localStorage.setItem('orgid',response.orgid);
localStorage.setItem('userid',response.userid);

 

下次请求，需要把orgid都带上任何一个接口，如何操作呢？当作一个token或是啥的。修改以下文件

src/utils/request.ts

 

headers: {
  orgid: localStorage.getItem("orgid")
},

以后请求的每个页面都会带上这个。当然也可以带token，道理一样

会带到http协议里

 

 

 

然后，后台要如果怎么取到这个值呢（thinkphp6.0）

 $org_id = $this->request->header('orgid');

通过以上方法直接把值取出来。

 

取出来后就可以做任何逻辑权限判断了。

另外，以上还用到了一些代理功能，如图所示。

 

以上是用户登录模块的全过程。希望有助于大家。