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 手机号验证码登陆的更多相关文章

  1. JavaWeb-SpringSecurity使用短信验证码登陆

    相关博文 JavaWeb-SpringBoot_一个类实现腾讯云SDK发送短信 传送门 系列博文 项目已上传至guthub 传送门 JavaWeb-SpringSecurity初认识 传送门 Java ...

  2. SpringSceurity(5)---短信验证码登陆功能

    SpringSceurity(5)---短信验证码登陆功能 有关SpringSceurity系列之前有写文章 1.SpringSecurity(1)---认证+授权代码实现 2.SpringSecur ...

  3. vue开发东京买菜,全栈项目,前端django,带手机GPS精准定位,带发票系统,带快递系统,带微信/支付宝/花呗/银行卡支付/带手机号一键登陆,等等

    因为博客园不能发视频,所以,完整的视频,开发文档,源码,请向博主索取 完整视频+开发文档+源码,duanshuiLu.com下载 vue+django手机购物商城APP,带支付,带GPS精准定位用户, ...

  4. django开发东京买菜,全栈项目,前端vue,带手机GPS精准定位,带发票系统,带快递系统,带微信/支付宝/花呗/银行卡支付/带手机号一键登陆,等等

    因为博客园不能发视频,所以,完整的视频,开发文档,源码,请向博主索取 完整视频+开发文档+源码,duanshuiLu.com下载 vue+django手机购物商城APP,带支付,带GPS精准定位用户, ...

  5. web自动化测试中绕开验证码登陆的方式

    web自动化测试中登陆需验证码是很大的一个困扰.现推荐一种简单的避开验证码登陆的方式,先代码进入登录页,人工输入验证码登录后浏览器自动保存cookie,再在新的标签中登录. 具体代码如下: publi ...

  6. Web UI自动化测试中绕开验证码登陆方式浅谈

    web自动化测试中让测试者感到困惑的是登陆验证码,每次都不一样.现在推荐一种绕开验证码登陆的方式,其实就是将web浏览器获取的登陆cookie加载到程序中就可以了,这样程序就会认为你已经登陆,就可以跳 ...

  7. 通过cookies跳过验证码登陆页面,直接访问网站的其它URL

    我每次手动访问去NN网的一家酒店,就不需要登陆,一旦我用脚本打开就会让我登陆,而登陆页面又有验证码,不想识别验证码,所以就想:“通过cookies跳过验证码登陆页面,直接访问网站的其它URL”   转 ...

  8. Spring Cloud OAuth2(二) 扩展登陆方式:账户密码登陆、 手机验证码登陆、 二维码扫码登陆

    概要 基于上文讲解的spring cloud 授权服务的搭建,本文扩展了spring security 的登陆方式,增加手机验证码登陆.二维码登陆. 主要实现方式为使用自定义filter. Authe ...

  9. 微信小程序+laravel 7+ Redis +短信宝 实现手机号验证码登录

    以下代码可以进行优化和封装:这里我实现功能为主,就不封装啦.小伙伴可以自己试着封装一下. 1:书写登录表单 <view class="container"> <v ...

随机推荐

  1. JVM学习十五 - (复习)类加载的时机、类加载过程、类加载器

    一.类加载的时机 类的生命周期 类从被加载到虚拟机内存开始,到卸载出内存为止,它的整个生命周期包括以下 7 个阶段: 加载 验证 准备 解析 初始化 使用 卸载 验证.准备.解析 3 个阶段统称为连接 ...

  2. hr虚线

    转载请注明来源:https://www.cnblogs.com/hookjc/ <hr size="1" noshade="noshade" style= ...

  3. 【struts2】中method={1}详解

    我们在使用struts2的时候,有时候为了简化struts2的配置项而采用通配符的方式,如下代码: <action name="ajaxregister!*" class=& ...

  4. Go vs Java vs C# 语法对比

    目录 1. 说明 2. 对比 2.1 关键字(keywords) 2.1.1 Go 2.1.2 Java 2.1.3 C# 2.1.4 小结 2.2 基本数据类型 2.2.1 Go 基本数据类型 2. ...

  5. LeetCode随缘刷题之转化成小写字母

    这道题应该是最简单的一道题了把,简直在侮辱我. package leetcode.day_12_12; /** * 709. 转换成小写字母 * 给你一个字符串 s ,将该字符串中的大写字母转换成相同 ...

  6. HTTP缓存协议实战

    一.什么是缓存 缓存,又称作Cache,我们把临时存储数据的地方叫做缓存池,缓存池里面放的数据就叫做缓存.当用户需要使用这些数据,首先在缓存中寻找,如果找到了则直接使用.如果找不到,则再去其他数据源中 ...

  7. PyCharm编程软件详细安装教程

    PyCharm编程软件安装教程&破解 一.官网下载软件 1. 网页搜索进入PyCharm官网下载页面(https://www.jetbrains.com/pycharm/download/ ) ...

  8. Unable to register node “xxx“ with API server: Unauthorized

    k8s二进制部署环境出现kubelet认证不了节点 出现这个情况的时候,第一个反应是先看apiserver证书是不是过期了 # 查看apiserver的service文件存储路径 systemctl ...

  9. Java高频面试题70道

    1.作用域public,private,protected,以及不写时的区别? 答:区别如下: 作用域  当前类 同一packag 子孙类 其他package public √ √ √ √ prote ...

  10. tor-browse

    https://sourceforge.net/projects/t-browser/