第一次做手机短信验证码，没有经验，学习好多教程，实现了这个功能，如果各位前辈有比较间洁高效的实现方式可以私信我，或者评论。希望我总结的可以帮助到需要的人。

当前版本

• PHP 7.3
• laravel 8
• Laravel-sms 2.6

一、配置

• 以阿里云为例配置信息
  购买阿里云短息服务之后，会有一套简单的申请教程，顺着填信息就行，然后就是等待审核,审核大概是1-2两个小时吧，反正我审核的时候是这样一个阶段，审核内容要按标准填，会被打回重新填。

• 以下审核通过之后的教程

  签名

  

模板

• 需要用到的信息
  accessKeyId
  accessKeySecret
  signName

• accessKeyId、accessKeySecret的位置如下

• 建议使用子用户，为什么不直接使用AccessKey，因为什么看图4里面的《黄黄黄》的那些字，子用户可以为其分配一定的权限，比较安全。用就对了别那么多疑惑。记得保存 accessKeyId 和 accessKeySecret，不保存用到的时候特别难受又得验证码这些，特别是验证目标手机号码还不是你自己的，强烈建议保存。

添加权限

二、代码

• 安装laravel-sms

  composer require toplan/laravel-sms:~2.6

  我用的是2.6，现在应该有比较新的，感兴趣自己去研究。

• 安装完成之后，在config/app.php文件中providers数组里加入

        //阿里云短信服务
        Toplan\PhpSms\PhpSmsServiceProvider::class,
        Toplan\Sms\SmsManagerServiceProvider::class,

  在config/app.php文件中的aliases数组里加入

  'PhpSms' =>  Toplan\PhpSms\Facades\Sms::class,
  'SmsManager' =>  Toplan\Sms\Facades\SmsManager::class,

• 生成配置文件，执行以下命令，选取自己要注册的服务就注册两个，找到就注册。

  php artisan vendor:publish

  注册完之后会在config配置文件里面生成 phpsms.php 和 laravel-sms.php

• 配置参数
  打开 phpsms.php 配置

注意：不是阿里大鱼，别配置错了

打开 laravel-sms.php 找到 templates 数组

到这里就配置完了。

• 上代码
  新建一个 .js 文件，名字随便起，想起拼音也行，把下面 js 放里面。

  (function($){
    $.fn.sms = function(options) {
        var self = this;
        var btnOriginContent, timeId;
        var opts = $.extend(true, {}, $.fn.sms.defaults, options);
        self.on('click', function (e) {
            btnOriginContent = self.html() || self.val() || '';
            changeBtn(opts.language.sending, true);
            send();
        });
  
        function send() {
            var url = getUrl();
            var requestData = getRequestData();
            $.ajax({
                url     : url,
                type    : 'post',
                data    : requestData,
                success : function (data) {
                    if (data.success) {
                        timer(opts.interval);
                    } else {
                        changeBtn(btnOriginContent, false);
                        opts.notify.call(null, data.message, data.type);
                    }
                },
                error   : function(xhr, type){
                    changeBtn(btnOriginContent, false);
                    opts.notify.call(null, opts.language.failed, 'request_failed');
                }
            });
        }
  
        function getUrl() {
            return opts.requestUrl ||
                '/laravel-sms/' + (opts.voice ? 'voice-verify' : 'verify-code')
        }
  
        function getRequestData() {
            var requestData = { _token: opts.token || '' };
            var data = $.isPlainObject(opts.requestData) ? opts.requestData : {};
            $.each(data, function (key) {
                if (typeof data[key] === 'function') {
                    requestData[key] = data[key].call(requestData);
                } else {
                    requestData[key] = data[key];
                }
            });
  
            return requestData;
        }
  
        function timer(seconds) {
            var btnText = opts.language.resendable;
            btnText = typeof btnText === 'string' ? btnText : '';
            if (seconds < 0) {
                clearTimeout(timeId);
                changeBtn(btnOriginContent, false);
            } else {
                timeId = setTimeout(function() {
                    clearTimeout(timeId);
                    changeBtn(btnText.replace('{{seconds}}', (seconds--) + ''), true);
                    timer(seconds);
                }, 1000);
            }
        }
  
        function changeBtn(content, disabled) {
            self.html(content);
            self.val(content);
            self.prop('disabled', !!disabled);
        }
    };
  
    $.fn.sms.defaults = {
        token       : null,
        interval    : 60,
        voice       : false,
        requestUrl  : null,
        requestData : null,
        notify      : function (msg, type) {
            alert(msg);
        },
        language    : {
            sending    : '短信发送中...',
            failed     : '请求失败，请重试',
            resendable : '{{seconds}} 秒后再次发送'
        }
    };
  })(window.jQuery || window.Zepto);

在你的项目里面引入刚才新建的 js 文件，加入以下代码

<script>
        $('#send-code').sms({
            //laravel csrf token
            token: "{{csrf_token()}}",
            //请求间隔时间
            interval: 60,
            //请求参数
            requestData: {
                //手机号
                mobile: function () {
                    var phone = $('#phone').val()// 输入的手机号，要发给谁

                    return phone;
                },
                //手机号的检测规则
                // mobile_rule : 'mobile_required'
            }
        });
    </script>

这样就能发送短信了

校验

我是直接在 laravel-sms.php 里面对生成的验证码进行缓存，然后再需要的地方取出来进行校验。程序走到这里，就发送成功了。验证码也就确定了，我就在这里缓存了。还有就是如果为该手机号发送短信到了上限，就会发送失败。

这样校验逻辑你自己也就有了方向了。
O 了

本作品采用《CC 协议》，转载必须注明作者和本文链接