天天看点

Thinkphp5使用阿里大于短信验证

一、首先到阿里大于平台上注册,创建应用

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

Thinkphp5使用阿里大于短信验证

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

Thinkphp5使用阿里大于短信验证

创建完毕后,可以获得应用的appkey和appsecret,这两个东东很重要

Thinkphp5使用阿里大于短信验证

然后在左侧的导航栏李选择sdk下载,在右边窗口里选择php版。

Thinkphp5使用阿里大于短信验证

下载完成后解压,得到如下文件:

Thinkphp5使用阿里大于短信验证

在所给的这些文件里,只要以下文件就够了:

Thinkphp5使用阿里大于短信验证

我们把这些文件放到tp5的extend目录里,建立一个文件夹alidayu,把所有文件放到该文件夹下。

然后回到阿里大于,在左侧导航栏里选择配置管理----验证码,然后在右侧窗口里可以看到两个选择项:配置短信签名 和 配置短信模板

Thinkphp5使用阿里大于短信验证

1 首先配置短信签名,这个是必须的,界面如下,根据自己的需要选择,个人使用选择第一个就行。

Thinkphp5使用阿里大于短信验证

2.配置短信模板

选择配置短信模板,然后添加模板:

Thinkphp5使用阿里大于短信验证

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

Thinkphp5使用阿里大于短信验证

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

二、在tp5中引用

1.项目的目录结构

Thinkphp5使用阿里大于短信验证

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

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

在tp5中加载类使用的时自动加载,是根据名空间加载的,所以,下载的几个类文件,必须定义名空间才能引用,名空间必须和目录一致。以alibabaaliqinfcsmsnumsendrequest.php为例说明:

Thinkphp5使用阿里大于短信验证

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

Thinkphp5使用阿里大于短信验证

如果,编译出现找不到topclient类的提示,可以在application下config.php里修改:

Thinkphp5使用阿里大于短信验证

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

4. 编写短信验证码方法

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

//短信验证

    public function sendsms()

    {

        if (request()->isajax()) {//如果是ajax请求

            $tel = input('mobile');//手机号

            $c = new topclient;//大于客户端  

            $c->format = 'json';//设置返回值得类型

            $c->appkey = "23885965";//阿里大于注册时给的应用appkey

            $c->secretkey = "ccd724869075d0d740806302b664bb86";//注册的app secretkey,修改成自己的

            //请求对象,需要配置请求的参数  

            $req = new alibabaaliqinfcsmsnumsendrequest;

            $req->setextend("123456");//公共回传参数,可以不传

            $req->setsmstype("normal");//短信类型,传入值请填写normal

            //签名,阿里大于-控制中心-验证码--配置签名 中配置的签名,必须填

            $req->setsmsfreesignname("自己的签名");//根据前面配置短信签名里的前面做相应的修改

            //你在短信中显示的验证码,这个要保存下来用于验证

            $num = rand(100000,999999);<br>               

            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;

        }  

    }

  

三、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>  

</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>  

</html>  

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