larav jq ajax 登录 

//自高自测登录8.10
Route::get('name/login','nameLoginController@login');
Route::post('/name/logins','nameLoginController@namelogin');/logins','nameLoginController@namelogin');
表单页面
<!doctype html>
<html lang="en">
<head>
    <meta name="csrf-token" content="{{ csrf_token() }}">
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>user登录</title>
    <link rel="stylesheet" href="http://apps.bdimg.com/libs/bootstrap/3.3.0/css/bootstrap.min.css">
</head>
<body>

<form action="/user/login/success" method="post" style="width: 300px">
    @csrf
    <div class="form-group">
        <label for="name">用户名</label>
        <input type="text" class="form-control" id="username" name="user_name" placeholder="请输入账号">
        <p style="color: red" class="usernametips"></p>
    </div>
    <div class="form-group">
        <label for="name">密码</label>
        <input type="password" class="form-control userpassword" name="user_password" placeholder="请输入密码">
        <p style="color: red" class="userpasswordtips"></p>
    </div>
    <button type="submit" class="btn btn-default" onclick="login()">立即登录</button>
</form>
</body>
</html>
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js">
</script>
<script>
    // 密码验证非空
    $('.userpassword').blur(function () {
        var userpassword = $('.userpassword').val();
        if (userpassword == '') {
            $('.userpasswordtips').html('密码不可以为空')
            return false
        } else {
            $('.userpasswordtips').html('')
            return true
        }
    })
    //用户名验证非空
    $('#username').blur(function () {
        var username = $('#username').val();
        if (username == '') {
            $('.usernametips').html('用户名不可以为空')
            return false
        } else {
            $('.usernametips').html('')
            return true
        }
    })

    function login() {
        var username = $('#username').val();
        var userpassword = $('.userpassword').val();

        $.ajax({
            url: '/user/login/success',
            type: 'post',
            dataType: 'json',
            data: {
                '_token':'{{csrf_token()}}',
                username: username,
                userpassword: userpassword,
            },
            success:function(e){
                console.log(e);
               if (e==200){
                   alert('登录成功');
               }else {
                   alert('登录失败');
               }

            }
        })
    }
</script>
控制器页面
<?php

namespace App\Http\Controllers;

use App\models\nameLogin;
use Illuminate\Http\Request;
use Illuminate\Foundation\Auth\User;
class nameLoginController extends Controller
{
    //
    public function login()
    {
        return view('login.loginname');
    }

    public function namelogin(Request $request)
    {
        $params = $request->except('_token');
   $this->validate($request,[
       'name'=>'required',
       'password'=>'required|regex:/^\d\w{4,32}$/'
   ],[
       'name.required'=>'账号不可以为空',
   'password.required'=>'密码不可以为空',
       'password.regex'=>'密码为6-10为字母及数字'
   ],$params);
   $data['name']=$params['name'];
   $data['password']=$params['password'];
//
        $result=nameLogin::testlogin($data);

if ($result){
    $arr['status']=200;
    $arr['info']='登录成功';
    $arr['data']=$result;
    return json_encode($arr);
}else{
    $arr['status']=500;
    $arr['info']='登录失败';
    $arr['data']=$result;
    return json_encode($arr);

}

    }
}
模型页面
<?php

namespace App\models;

use Illuminate\Database\Eloquent\Model;

class nameLogin extends Model
{
    //
    protected $table='testlogin';
    public $primaryKey='id';
    public $timestamps=false;
    public static function testlogin($data){
       return self::where($data)->first();
}
}

 

posted @ 2021-08-12 13:27  王越666  阅读(86)  评论(0)    收藏  举报