阿里云

登录-Thinkphp5.1开发后台管理系统

登录,是每一个后台管理系统的主要模块,请注意“登录”而不是“登陆”。

框架采用路由模式,本文包含:开启路由、路由配置、公共控制器、登录控制器等内容;

一、开启路由

将config目录下的app.php文件(thinkphp5.1版本核心配置文件)内的路由配置项设置为开启状态;

// 是否强制使用路由
'url_route_must'         => true,


二、路由配置

thinkphp5.1版本将路由文件单独拿了出来,不同于5.1版本放置与application目录下,新版本将其放置在public同级目录下。目录名为‘route’,默认路由文件名‘route.php’。

我们将默认文件内的代码一删除,插入代码二,路由采用分组+请求方式形式,增强路由解析能力和请求安全问题。

代码一:

<?php
// +----------------------------------------------------------------------
// | ThinkPHP [ WE CAN DO IT JUST THINK ]
// +----------------------------------------------------------------------
// | Copyright (c) 2006~2018 http://thinkphp.cn All rights reserved.
// +----------------------------------------------------------------------
// | Licensed ( http://www.apache.org/licenses/LICENSE-2.0 )
// +----------------------------------------------------------------------
// | Author: liu21st <liu21st@gmail.com>
// +----------------------------------------------------------------------

Route::get('think', function () {
    return 'hello,ThinkPHP5!';
});

Route::get('hello/:name', 'index/hello');

return [

];


代码二:

<?php
// +----------------------------------------------------------------------
// | ThinkPHP [ WE CAN DO IT JUST THINK ]
// +----------------------------------------------------------------------
// | Copyright (c) 2006~2018 http://thinkphp.cn All rights reserved.
// +----------------------------------------------------------------------
// | Licensed ( http://www.apache.org/licenses/LICENSE-2.0 )
// +----------------------------------------------------------------------
// | Author: liu21st <liu21st@gmail.com>
// +----------------------------------------------------------------------
//Administration
Route::group('admin', function () {
    Route::rule('', 'admin/Index/index');    //后台首页
    Route::group('Login', function () {
        Route::get('index', 'admin/Login/index'); //登录
        Route::post('login', 'admin/Login/dologin');  //登录处理
        Route::get('code', 'admin/Login/docode');   //验证码
        Route::get('out', 'admin/Login/doout');   //退出登录
    });
});
return [];


三、公共控制器

在application/admin/controller下新建名为‘Base.php’的控制器文件,这里说下新建方法,可以通过5.1版本的命令行模式进行新建,也可以手动新建,命令行模式会将增删改查等方法自动建立,便于开发,适用于非数据库操作控制器。我们将采用手动新建模式,因为控制器不含有数据库操作,故不采用命令行模式。

<?php
/**
 * Created by PhpStorm.
 * User: Administrator
 * Date: 2019\2\17 0017
 * Time: 10:45
 */
namespace app\admin\controller;
use think\App;
use think\Controller;
class Base extends Controller
{
    public function __construct(App $app = null)
    {
        parent::__construct($app);
        $userName = session('userName','','admin');
        if($userName){
            $this->assign('userName',$userName);
        }else{
            $this->redirect('Login/index');
        }
    }
}


将controller目录下的Index控制器(即Index.php文件)继承Base控制器;

<?php
namespace app\admin\controller;

class Index extends Base
{
    /**
     * 后台首页
     * @return \think\response\View
     */
    public function index()
    {
        return view('Index/index');
    }
}


在Login控制器内写入登录页面、登录请求、登录验证码方法;

这里需要注意Login控制器不需要继承Base控制器;

一、登录页面

/**
 * 登录
 * @return \think\response\View
 */
public function index()
{
    return view('Login/login');
}


二、登录请求

/**
 * 登录处理
 */
public function dologin()
{
    $userName = input('post.username');
    $userPass = input('post.userpass');
    if(!$userName || !$userPass) {
        $this->error('请填写账号或密码,100');
    }
    $code = input('post.code');
    if(!captcha_check($code)) {
        $this->error('验证码错误,101');
    }
    $res = $this->user_model->getOne(['username' => $userName], 'userpass,display');
    if(!$res) {
        $this->error('账号或密码错误,102');
    }
    if($res['display'] == 2) {
        $this->error('您的账户已冻结,103');
    }
    if(md5($userPass) !== $res['userpass']) {
        $this->error('账号或密码错误,104');
    }
    session('userName', $userName, 'admin');
    $this->success('登录成功');
}


三、登录验证码

/**
 * 验证码
 * @return mixed
 */
public function docode()
{
    $config  = [
        'fontSize' => 30,
        'length' => 3,
        'useCurve' => false,
        'useNoise' => false,
        'codeSet' => '023456789'
    ];
    $captcha = new Captcha($config);

    return $captcha->entry();
}


四、登录页面

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>登录 - Shirley 后台大布局</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <link rel="stylesheet" href="__Static__/css/layui.css" media="all">
    <link rel="stylesheet" href="__Static__/css/login.css">
</head>
<body class="layui-layout-body">
<div class="layui-row">
    <div class="layui-col-xs1 layui-col-sm2 layui-col-md4 left"></div>
    <div class="layui-col-xs10 layui-col-sm8 layui-col-md4 center">
        <div class="login_logo">
            <h1 align="center">Shirley 后台管理模板系统</h1>
        </div>
        <form action="{:url('Login/login')}" method="post" class="alyui-form">
            <div class="layui-form-item">
                <div class="layui-inline">
                    <label class="layui-form-label">账号</label>
                    <div class="layui-input-inline">
                        <input type="text" name="username" lay-verify="required|text" class="layui-input">
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">密码</label>
                    <div class="layui-input-inline">
                        <input type="password" name="userpass" lay-verify="required|password" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">验证码</label>
                    <div class="layui-input-inline login-form-code">
                        <input type="text" name="code" lay-verify="required|text" autocomplete="off" class="layui-input">
                    </div>
                    <div class="layui-input-inline login-form-code">
                        <img src="{:url('Login/code')}" alt="验证码" id="randcode" onclick="this.src=this.src+'?'">
                    </div>
                </div>
                <div class="login_btn">
                    <input type="submit" class="layui-btn layui-btn-fluid" value="登录">
                </div>
            </div>
        </form>
        <p id="copyright">© www.shenlin.ink</p>
    </div>
    <div class="layui-col-xs1 layui-col-sm2 layui-col-md4 right"></div>
</div>
<script src="__Static__/layui.js"></script>
</body>
</html>


五、thinkphp5.1版本验证码生成问题

请参考:thinkphp5.1版本-验证码生成和校验


喜欢就点个赞吧