tp6 实现简单登录

小壮de...

已于 2022-09-30 09:07:58 修改

阅读量1.1k

点赞数 4

文章标签： php

于 2022-09-29 22:28:04 首次发布

本文链接：https://blog.csdn.net/lxz15516116653/article/details/127113977

版权

1、配置路由

  //登录页面
    Route::get('login','Login/login');

2、写html表单页面

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        .main{
            width: 500px;
            margin: 10px auto;
            padding: 30px;
            box-shadow: black 0 0 10px;
        }
        span{
            color: red;
        }
    </style>
    <!--    引入jquery-->
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.1/jquery.js"></script>
    <!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
</head>
<body>
<div class="main">
    <div class="form-group">
        <label for="account">账号</label>
        <input type="text" class="form-control" id="account" placeholder="请输入您的账号">
        <span class="error"></span>
    </div>
    <div class="form-group">
        <label for="password">密码</label>
        <input type="password" class="form-control" id="password" placeholder="请输入您的密码">
        <span class="error"></span>
    </div>
    <button type="button" id="btn" class="btn btn-primary">登录</button>
</div>
</body>

3、控制器方法

     /**
     * @return \think\response\View
     * 登录页面
     */
   public function login(){
       return view();
   }

4、ajax异步请求

<script>
    //给定button按钮点击事件
    $('#btn').click(function () {
        //接收账号
        let account = $('#account').val();
        //判断非空验证
        if (account == ''){
            $('.error:eq(0)').text('账号不能为空');
            return false;
        }else{
            $('.error:eq(0)').text('');
        }
        //接收密码
        let password = $('#password').val();
        //判断非空
        if (password == ''){
            $('.error:eq(1)').text('密码不能为空');
            return false;
        }else {
            $('.error:eq(1)').text('');
        }
        //异步请求
        $.ajax({
            url:'doLogin',
            dataType:'json',
            data:{
                account:account,
                password:password
            },
            type:'post',
            success:function (response) {
                if (response.code == 2001){
                    $('.error:eq(0)').text(response.msg);
                    return false;
                }else if (response.code == 2002){
                    $('.error:eq(1)').text(response.msg);
                    return false;
                }else if (response.code == 200){
                   window.location.href= '';
                }
            }
        })


    })
</script>

5、配置数据库

// 数据库连接配置信息
    'connections'     => [
        'mysql' => [
            // 数据库类型
            'type'            => env('database.type', 'mysql'),
            // 服务器地址
            'hostname'        => env('database.hostname', '127.0.0.1'),
            // 数据库名
            'database'        => '在此输入本地或线上数据库名',
            // 用户名
            'username'        => '数据库的账号',
            // 密码
            'password'        => '数据库密码',
            // 端口
            'hostport'        => env('database.hostport', '3306'),
            // 数据库连接参数
            'params'          => [],
            // 数据库编码默认采用utf8
            'charset'         => env('database.charset', 'utf8'),
            // 数据库表前缀
            'prefix'          => env('database.prefix', ''),

            // 数据库部署方式:0 集中式(单一服务器),1 分布式(主从服务器)
            'deploy'          => 0,
            // 数据库读写是否分离 主从式有效
            'rw_separate'     => false,
            // 读写分离后 主服务器数量
            'master_num'      => 1,
            // 指定从服务器序号
            'slave_no'        => '',
            // 是否严格检查字段是否存在
            'fields_strict'   => true,
            // 是否需要断线重连
            'break_reconnect' => false,
            // 监听SQL
            'trigger_sql'     => env('app_debug', true),
            // 开启字段缓存
            'fields_cache'    => false,
        ],

6、后端接收数据查询数据库

/**
     * 登录的方法
     * @param Request $request
     * @return \think\response\Json
     */
   public function doLogin(Request $request){
       try {
            //接收账号
           $account = $request->post('account');
            //接收密码
           $password = $request->post('password');
            //调用数据库查询一天数据
           $sql = \app\one\model\Login::where('account',$account)->find();
            //判断账号是否存在
           if (!$sql){
               throw new \Exception('账号不存在',2001);
            //判断密码
           }elseif ($sql['password'] != encrypt_password($password)){
               throw new \Exception('密码错误',2002);
               //成功
           }else{
               return json(['code'=>200,'msg'=>'登录成功','data'=>[]]);
           }
       }catch (\Exception $exception){
            //捕获异常
           return json(['code'=>$exception->getCode(),'msg'=>$exception->getMessage(),'data'=>[]]);
       }

   }