Thinkphp5使用阿里大于短信验证

时间 2019-11-14

标签 thinkphp5 thinkphp 使用阿里大于短信验证栏目 PHP 繁體版

原文原文链接

如今各类平台登陆验证不少时候会使用短信验证，快捷安全，有不少平台提供短信验证服务，相比较而言阿里大于价格比较便宜，快捷，因此在在千锋平常的php教学中多以此为例来讲明短信验证的使用。下面咱们在tp5中说明如何使用阿里大于进行短信验证。javascript

1、首先到阿里大于平台上注册，建立应用php

阿里大于地址为：https://www.alidayu.com/，点击免费入住，而后注册，注册完毕后，进入管理中心。以下图所示在左边导航栏里选择---应用管理，而后在右边内容窗口里选择建立应用。css

在左侧导航栏里选择应用管理----应用列表。而后在右边窗口中选择建立应用html

建立完毕后，能够得到应用的appkey和appsecret，这两个东东很重要java

而后在左侧的导航栏李选择SDK下载，在右边窗口里选择php版。jquery

下载完成后解压，获得以下文件：ajax

在所给的这些文件里，只要如下文件就够了：json

咱们把这些文件放到tp5的extend目录里，创建一个文件夹alidayu，把全部文件放到该文件夹下。安全

而后回到阿里大于，在左侧导航栏里选择配置管理----验证码，而后在右侧窗口里能够看到两个选择项：配置短信签名 和 配置短信模板session

1 首先配置短信签名，这个是必须的，界面以下，根据本身的须要选择，我的使用选择第一个就行。

2.配置短信模板

选择配置短信模板，而后添加模板：

这里，模板内容是重点，好比说验证码短信通常会有一个随机数，这个随机数如何表示内，就用${number}这种方式表示，其中${number}就是php中对应的变量，用几个就定义几个，{}里面是变量的名字。配置完成后以下图所示：

重点是模板ID，这个在程序代码中要用。

2、在tp5中引用

1.项目的目录结构

要想在项目中引用extend下的alidayu下面的几个类，必须给类添加名空间。

二、给下载的文件添加名空间。

在tp5中加载类使用的时自动加载，是根据名空间加载的，因此，下载的几个类文件，必须定义名空间才能引用，名空间必须和目录一致。

3.在控制器里引用验证码类

若是，编译出现找不到TopClient类的提示，能够在application下config.php里修改：

添加一个名空间和文件夹的对照，则一切ok。

4. 编写短信验证码方法

//短信验证
	public function sendSMS() 
	{
		if (request()->isAjax()) {//若是是ajax请求
			$tel = input('mobile');//手机号
			               
			$c = new TopClient;//大于客户端   
			$c->format = 'json';//设置返回值得类型

			$c->appkey = "23885965";//阿里大于注册应用的key
		    $c->secretKey = "ccd724869075d0d740806302b664bb86";//注册的secretkey
		                                                       
		    //请求对象，须要配置请求的参数   
			$req = new AlibabaAliqinFcSmsNumSendRequest;
			$req->setExtend("123456");//公共回传参数，能够不传
			$req->setSmsType("normal");//短信类型，传入值请填写normal
			
			//签名，阿里大于-控制中心-验证码--配置签名 中配置的签名，必须填
			$req->setSmsFreeSignName("本身的签名");//根据前面配置短信签名里的前面作相应的修改
			
			//你在短信中显示的验证码，这个要保存下来用于验证
			$num = rand(100000,999999);
　　　　　　　　　　　　　　　session('code',$num);//保存到session

			//短信模板变量，传参规则{"key":"value"}，key的名字须和申请模板中的变量名一致，传参时需传入{"code":"1234","product":"alidayu"}
			$req->setSmsParam("{\"number\":\"$num\"}");//模板参数
			                                           
			//短信接收的手机号码，能够有多个，具体参照大于号帮助文档。
		        $req->setRecNum($tel);

			//短信模板。阿里大于-控制中心-验证码--配置短信模板 必须填
			$req->setSmsTemplateCode("SMS_69685034");//根据前面配置模板是生成的模板ID修改
			$resp = $c->execute($req);//发送请求
			return $resp;
		}	
	}

3、html文件

<!DOCTYPE html>
<html>
<head>
	<title>用户注册</title>
	<style type="text/css">
	*{margin: 0px;padding: 0px;}
	.content{width: 360px;background: pink;}
	.title{text-align: center;font-size: 18px;width:100%;height: 30px;line-height: 30px;}
	.register{height: 30px;line-height: 30px;width: 60px;text-align: center;float: right;}
	a{text-decoration: none;}
	.middle{width: 360px;}
	.headimage{width: 100%;}
	.headimage p{text-align: center;}
	.middle input{display: block;width: 98%;margin: 0px auto;height: 30px;}
	.middle input[type='submit']{margin-top: 20px;}
	.middle form .code{display: inline-block;width: 75%;height: 30px;}
	.middle form button{width: 22%;height: 32px;}
	</style>
	<script type="text/javascript" src='/static/index/js/jquery-1.11.3.min.js'></script>
</head>
<body>
	<div class='content'>
		<div class='top'>
			<div class='title'>注册</div>
		</div>
		<div class='middle'>
			<div class='headimage'>
				<img src="">
				<p>书非借不能读</p>
			</div>
			<form action='/index/user/doLogin' method='post'>
				<input type="text" name="phone" placeholder="手机号" id='mobile'>
				<input type="password" name="password" placeholder="密码">
				<input type="text" name="code" class='code' placeholder="验证码"><button id='sendmsg'>获取验证码</button>
				<input type="submit" value='注册'>
			</form>
		</div>

	</div>
</body>
<script type="text/javascript">
	//验证手机号
	$("#mobile").blur(function(){
		var value = $(this).val();
		console.log(value,typeof value);
		if ( 0 == value.lenght || "" == value) {
			//alert("手机号不能为空！")
			$(this).focus();
		} else {
			$.post('/index/user/validPhone',{phone:value},function(data){
				if (data) {
					alert("手机号重复！");
				}
			});
		}
		
	});

    var InterValObj; //timer变量，控制时间
    var count = 60; //间隔函数，1秒执行
    var curCount;//当前剩余秒数
    var code = ""; //验证码
    var codeLength = 6;//验证码长度

    $('#sendmsg').click(function () {
    	var phone = $("#mobile").val();
    	console.log(phone);
    	$.ajax({
    		type: "POST",
    		url: "/index/user/sendSMS",
    		data: "mobile="+$("#mobile").val() ,
    		success: function (data) {
    			console.log(data);
                	//data.result && data.result.success
                	if(data){
                		curCount = count;
                       //设置button效果，开始计时
                       $("#sendmsg").css("background-color", "LightSkyBlue");
                       $("#sendmsg").attr("disabled", "true");
                       $("#sendmsg").html("获取" + curCount + "秒");
                       InterValObj = window.setInterval(SetRemainTime, 1000); //启动计时器，1秒执行一次
                      // alert("验证码发送成功，请查收!");
                  }
              },
              dataType: 'json'
          });
    	return false;
    })

    function SetRemainTime() {
        if (curCount == 0) {
            window.clearInterval(InterValObj);//中止计时器
            $("#sendmsg").removeAttr("disabled");//启用按钮
            $("#sendmsg").css("background-color", "");
            $("#sendmsg").html("重发验证码");
            code = ""; //清除验证码。若是不清除，过期间后，输入收到的验证码依然有效
        }
        else {
            curCount--;
            $("#sendmsg").html("获取" + curCount + "秒");
        }
    }
</script>
</script>
</html>

更多实用php技术，请持续关注千锋教学日记。