laravel7 手机号验证码登陆

1”设置路由：

//展示手机登录页面

Route::get('admin','admin\AdminController@admin');

2：html页面

<!DOCTYPE HTML>

<html>

<head>

    <meta charset="utf-8">

    <meta name="renderer" content="webkit|ie-comp|ie-stand">

    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

    <meta name="viewport"

          content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>

    <meta http-equiv="Cache-Control" content="no-siteapp"/>

    <!--[if lt IE 9]>

    <script type="text/javascript" src="lib/html5shiv.js"></script>

    <script type="text/javascript" src="lib/respond.min.js"></script>

    <![endif]-->

    <link href="/static/static/h-ui/css/H-ui.min.css" rel="stylesheet" type="text/css"/>

    <link href="/static/static/h-ui.admin/css/H-ui.login.css" rel="stylesheet" type="text/css"/>

    <link href="/static/static/h-ui.admin/css/style.css" rel="stylesheet" type="text/css"/>

    <link href="/static/lib/Hui-iconfont/1.0.8/iconfont.css" rel="stylesheet" type="text/css"/>

    <!--[if IE 6]>

    <script type="text/javascript" src="lib/DD_belatedPNG_0.0.8a-min.js"></script>

    <script>DD_belatedPNG.fix('*');</script>

    <![endif]-->

    <title>后台登录 - H-ui.admin v3.1</title>

    <meta name="keywords" content="H-ui.admin v3.1,H-ui网站后台模版,后台模版下载,后台管理系统模版,HTML后台模版下载">

    <link rel="stylesheet" href="http://apps.bdimg.com/libs/bootstrap/3.3.0/css/bootstrap.min.css">

    <meta name="description" content="H-ui.admin v3.1，是一款由国人开发的轻量级扁平化网站后台模板，完全免费开源的网站后台管理系统模版，适合中小型CMS后台系统。">

</head>

<body>

<input type="hidden" id="TenantId" name="TenantId" value=""/>

<div class="header"></div>

<div class="loginWraper">

    <div id="loginform" class="loginBox">

        <form class="form form-horizontal">

            <div class="row cl">

                <label class="form-label col-xs-3"><i class="Hui-iconfont"></i></label>

                <div class="formControls col-xs-8">

                    <input id="phone" name="" type="text" value="18303550213" class="input-text size-L"

                           style="width: 200px">

                    <button type="button" class="btn btn-primary" style="width: 50px" id="dyMobileButton">发送</button>

                </div>

            </div>

            <div class="row cl">

                <label class="form-label col-xs-3"><i class="Hui-iconfont"></i></label>

                <div class="formControls col-xs-8">

                    <input id="test_code" name="" type="password" value="3898" placeholder="验证码"

                           class="input-text size-L" style="width: 200px">

                </div>

            </div>

            <div class="row cl">

                <div class="formControls col-xs-8 col-xs-offset-3">

                    <input name="" id="phoneLogin" type="button" class="btn btn-success radius size-L"

                           value="&nbsp;登&nbsp;&nbsp;&nbsp;&nbsp;录&nbsp;">

                    <input name="" type="reset" class="btn btn-default radius size-L"

                           value="&nbsp;取&nbsp;&nbsp;&nbsp;&nbsp;消&nbsp;">

                </div>

            </div>

        </form>

    </div>

</div>

>

<script type="text/javascript" src="/static/lib/jquery/1.9.1/jquery.min.js"></script>

<script type="text/javascript" src="/static/static/h-ui/js/H-ui.min.js"></script>

<!--此乃百度统计代码，请自行删除-->

<script>

    $('#dyMobileButton').click(function () {

        var _token = "{{csrf_token()}}";

        var phone = $('#phone').val();

        if (phone == '') {

            alert('手机号不能为空');

            return false;

        } else if (!/^1[3-9]\d{9}$/.test(phone)) {

            alert('手机号规则不正确');

            return false;

        }

        //短信发送限制

        var time = 60;

        setInterval(function () {

            time--;

            if (time > 0) {

                //开始倒计时

                $('#dyMobileButton').html('重新发送，还剩：' + time + '秒');

                $('#dyMobileButton').prop('disabled', true);

            } else {

                //结束倒计时

                $('#dyMobileButton').html('发送验证码');

                $('#dyMobileButton').prop('disabled', false);

            }

        }, 1000);

        //请求短信接口

        $.ajax({

            'url': '{{url('sendMsg')}}',

            'type': 'POST',

            'data': {

                _token: _token,

                sendPhone: phone

            },

            'datatype': 'json',

            'success': function (res) {

                console.log(res);

                return;

            },

            'error': function (error) {

                console.log(error);

                return false;

            },

        });

    });

    //点击登录按钮触发Ajax

    $('#phoneLogin').click(function () {

        var test_code = $('#test_code').val();

        var _token = "{{csrf_token()}}";

        var phone = $('#phone').val();

        if (test_code == '') {

            alert('验证码为填');

            return false;

        }

        if (phone == '') {

            alert('手机号为未填');

            return false;

        }

        //请求短信接口

        $.ajax({

            'url': '{{url('phonelogin')}}',

            'type': 'POST',

            'data': {

                _token: _token,

                sendPhone: phone,

                test_code: test_code

            },

            'datatype': 'json',

            'success': function (res) {

                console.log(res);

                if (res.code == 500) {

                    alert('验证码错误，请重新填写')

                }

                if (res.code == 200) {

                    alert('登录成功')

                    window.location.href = "{{url('index')}}"

                }

            },

            'error': function (error) {

                console.log(error);

                return false;

            },

        });

    })

</script>

<!--/此乃百度统计代码，请自行删除

</body>

</html>

3：设置路由，后端验证

//手机验证码

Route::post('sendMsg','admin\AdminController@sendMsg');

//手机号登录

Route::post('phonelogin','admin\AdminController@phoneLogin');

4：控制器代码

记住填写短信平台账号和短信平台密码；要是不改就是手机免费短信就被用完啦

    public function sendMsg(Request $request)

    {

//接受发送的手机号

        $postsendPhone = $request->post('sendPhone');

//        数据库验证，如果没有手机号，先进行注册

        $test_phone = User::where('phone', $postsendPhone)->first();

        if ($test_phone == false) {

            return ['code' => 500, 'meg' => '数据库没有这个手机号', 'data' => ''];

        }

        $statusStr = array(

            "0" => "短信发送成功",

            "-1" => "参数不全",

            "-2" => "服务器空间不支持,请确认支持curl或者fsocket，联系您的空间商解决或者更换空间！",

            "30" => "密码错误",

            "40" => "账号不存在",

            "41" => "余额不足",

            "42" => "帐户已过期",

            "43" => "IP地址限制",

            "50" => "内容含有敏感词"

        );

//        手机号发送验证码

        $smsapi = "http://api.smsbao.com/";

        $user = ""; //短信平台帐号

        $pass = md5(""); //短信平台密码

        $code = rand('1000', '9999');

        $content = "【百味园】您的验证码是$code,30秒内有效.若非本人操作请忽略此消息。";//要发送的短信内容

        $phone = $postsendPhone;//要发送短信的手机号码

        $sendurl = $smsapi . "sms?u=" . $user . "&p=" . $pass . "&m=" . $phone . "&c=" . urlencode($content);

        $result = file_get_contents($sendurl);

//        将验证码储在缓冲，设置过期时间为一分钟

        cache([$phone => $code],1);

        cache([$phone.'time'=>time()]);

        return ['code' => 200, 'meg' => $statusStr[$result], 'data' => ''];

    }

//登录触发

    public function phoneLogin(Request $request)

    {

        $login=$request->post();

//        接受验证码

        $test_code=$login['test_code'];

//        取出储的验证码

        $redisCode= cache($login['sendPhone']);

       // return ['code' => 200, 'meg' => 'ok', 'data' => $redisCode];

//        进行对比

        if ($test_code!=$redisCode){

//返回前台

            return ['code' => 500, 'meg' => '验证码错误', 'data' => ''];

        }

//        验证成功，返回前台

         return ['code' => 200, 'meg' => 'ok', 'data' => ''];

    }

5：模型验证数据库有没有手机号

<?php

namespace App\models;

use Illuminate\Database\Eloquent\Model;

class User extends Model

{

    //

    protected $table='user';

}

效果图：

laravel7 手机号验证码登陆的更多相关文章

JavaWeb-SpringSecurity使用短信验证码登陆
相关博文 JavaWeb-SpringBoot_一个类实现腾讯云SDK发送短信传送门系列博文项目已上传至guthub 传送门 JavaWeb-SpringSecurity初认识传送门 Java ...
SpringSceurity(5)---短信验证码登陆功能
SpringSceurity(5)---短信验证码登陆功能有关SpringSceurity系列之前有写文章 1.SpringSecurity(1)---认证+授权代码实现 2.SpringSecur ...
vue开发东京买菜,全栈项目,前端django,带手机GPS精准定位,带发票系统,带快递系统,带微信/支付宝/花呗/银行卡支付/带手机号一键登陆,等等
因为博客园不能发视频,所以,完整的视频,开发文档,源码,请向博主索取完整视频+开发文档+源码,duanshuiLu.com下载 vue+django手机购物商城APP,带支付,带GPS精准定位用户, ...
django开发东京买菜,全栈项目,前端vue,带手机GPS精准定位,带发票系统,带快递系统,带微信/支付宝/花呗/银行卡支付/带手机号一键登陆,等等
因为博客园不能发视频,所以,完整的视频,开发文档,源码,请向博主索取完整视频+开发文档+源码,duanshuiLu.com下载 vue+django手机购物商城APP,带支付,带GPS精准定位用户, ...
web自动化测试中绕开验证码登陆的方式
web自动化测试中登陆需验证码是很大的一个困扰.现推荐一种简单的避开验证码登陆的方式,先代码进入登录页,人工输入验证码登录后浏览器自动保存cookie,再在新的标签中登录. 具体代码如下: publi ...
Web UI自动化测试中绕开验证码登陆方式浅谈
web自动化测试中让测试者感到困惑的是登陆验证码,每次都不一样.现在推荐一种绕开验证码登陆的方式,其实就是将web浏览器获取的登陆cookie加载到程序中就可以了,这样程序就会认为你已经登陆,就可以跳 ...
通过cookies跳过验证码登陆页面，直接访问网站的其它URL
我每次手动访问去NN网的一家酒店,就不需要登陆,一旦我用脚本打开就会让我登陆,而登陆页面又有验证码,不想识别验证码,所以就想:“通过cookies跳过验证码登陆页面,直接访问网站的其它URL” 转 ...
Spring Cloud OAuth2（二）扩展登陆方式：账户密码登陆、手机验证码登陆、二维码扫码登陆
概要基于上文讲解的spring cloud 授权服务的搭建,本文扩展了spring security 的登陆方式,增加手机验证码登陆.二维码登陆. 主要实现方式为使用自定义filter. Authe ...
微信小程序+laravel 7+ Redis +短信宝实现手机号验证码登录
以下代码可以进行优化和封装:这里我实现功能为主,就不封装啦.小伙伴可以自己试着封装一下. 1:书写登录表单 <view class="container"> <v ...

随机推荐

计算机电子书 2019 BiliDrive 备份
下载方式 pip install BiliDriveEx bdex download <link> 链接文档链接传智播客轻松搞定系列 C.C++.Linux.设计模式.7z (33. ...
AT2347 [ARC070C] NarrowRectangles
首先不难看出一个暴力的 \(dp\) 解法,考虑令 \(dp_{i, j}\) 表示考虑完前 \(i\) 个矩形,第 \(i\) 个矩形左端点在 \(j\) 时所需要的最小花费. 不难有转移: \[d ...
swwager的使用
最近弄swwager文档,被搞得恼火,故记录一下先展示一下现有的页面,此页面由swwager自动生成配置步骤: 一:导入swwager的依赖 <!-- =================== ...
wget: unable to resolve host address ‘dl.grafana.com’的解决方法
[root@Server-qnrsyp system]# wget --no-check-certificate https://dl.grafana.com/oss/release/grafana_ ...
认识Visual C++ 6.0工程结构
shell脚本之循环语句与函数
shell脚本之循环语句与函数 echo的用法: echo -n #表示不换行输出 echo -e #输出转义字符,将转义后的内容输出到屏幕上转义字符: \n :换行,被输出的字符从"\n ...
java_web开发中遇到可坑
目前有两个坑,: 一首先在启动tomcat的时候我进行的一个跳转页面的操作然后报了如下的错误: org.apache.jasper.JasperException: /jsp/frame.jsp ...
Ubuntu20.04 安装MongoDB及其基本使用
MongoDB 官方文档本博客旨在自我学习使用,如有任何疑问请及时联系博主基本介绍 MongoDB 是由C++语言编写并基于分布式文件存储的开源数据库. MongoDB 是一款介于关系数据库和非关 ...
解决OpenOCD烧录STM32失败, 无法通过SWD连接的问题
OpenOCD烧录STM32失败的问题 Linux下使用 OpenOCD 烧录 STM32, 出现了 Error: init mode failed (unable to connect to the ...
十年OI一场空，不开long long见祖宗
//线段树:单点修改+区间求和 #include<bits/stdc++.h> #define ll unsigned long long using namespace std; ll ...

laravel7 手机号验证码登陆

laravel7 手机号验证码登陆的更多相关文章

随机推荐

热门专题