php手機註冊使用者簡訊傳送驗證碼，以及點擊發送驗證碼的倒計時效果。
阿新 • • 發佈：2019-01-25
php手機註冊傳送簡訊，我們用的是阿里的簡訊服務，首先你要有阿里的賬號，並開通了簡訊服務。可以單條計費也可以買套餐。
首先html部分我用的是bootstrap布的頁面：
<html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> <!-- Latest compiled and minified CSS & JS --> <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> <link rel="stylesheet" media="screen" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> </head> <body> <div class="container"> <br> <br> <br> <br> <form class="form-horizontal" role="form" > <div class="form-group" style="text-align: center"> <label for="inputEmail3" class="col-sm-4 control-label">手機號</label> <div class="col-sm-8"> <div style="float: left;"> <input id="phonum" name="phonum" type="text" class="form-control phonum" style="width: 300px;"> </div> <div style="float: left;"> <!--<input class="btn btn-info" type="button" id="getcode" onclick="send(this)" value="點選獲取手機驗證碼" />--> <button class="btn btn-info" type="button" id="getcode" onclick="send(this)"> 獲取驗證碼</button> <span id="telephonenameTip"></span> </div> </div> </div> <div class="form-group"> <label class="col-sm-4 control-label">驗證碼</label> <div class="col-sm-8"> <input style="width: 300px;" class="form-control" id="codename"> <span id="codenameTip"></span> </div> </div> <div class="form-group"> <label for="inputPassword3" class="col-sm-4 control-label">密碼</label> <div class="col-sm-8"> <input type="password" style="width: 300px;" class="form-control" id="" placeholder="Password"> </div> </div> <div class="form-group"> <div class="col-sm-offset-5 col-sm-6"> <button type="button" id="submit" class="btn btn-primary">立即註冊</button> </div> </div> </form> </div> </body> </html>
然後是js部分：放到<body>下面，主要是點擊發送簡訊按鈕的非同步方法以及簡訊倒計時效果：
然後就是處理簡訊傳送的api介面php程式碼，看清，要填的只有一部分，下面的幾乎不用填寫：<script> time =3; //簡訊倒計時時間 function send(obj) { var timer = setInterval(function () { time--; $(obj).text(time+'之後重發'); $(obj).removeClass('btn-info'); $(obj).addClass('btn-success') $(obj).prop('disabled', true); if(time==0){ //清除定時器 clearInterval(timer) $(obj).removeClass('btn-success'); $(obj).addClass('btn-info'); $(obj).prop('disabled', false); $(obj).text('獲取驗證碼'); time=3; } },1000); //獲取手機號 var phonum = $('#phonum').val(); $.post('?a=sendSms',{phonum:phonum},function () { },'json') } </script>
public function sendSms(){ $phone = $_POST['phonum']; $params = array (); // *** 需使用者填寫部分 *** // fixme 必填: 請參閱 https://ak-console.aliyun.com/ 取得您的AK資訊 $accessKeyId = "LTAIA3gKjdIyIoB4"; $accessKeySecret = "NTKVP79Uqftg07wPDK0cwhEqsAimVW"; // fixme 必填: 簡訊接收號碼 $params["PhoneNumbers"] = $phone; // fixme 必填: 簡訊簽名，應嚴格按"簽名名稱"填寫，請參考: https://dysms.console.aliyun.com/dysms.htm#/develop/sign $params["SignName"] = "琥珀"; // fixme 必填: 簡訊模板Code，應嚴格按"模板CODE"填寫, 請參考: https://dysms.console.aliyun.com/dysms.htm#/develop/template $params["TemplateCode"] = "SMS_137135108"; // fixme 可選: 設定模板引數, 假如模板中存在變數需要替換則為必填項 $code = $this->Getcode(); // echo $code;die(); //測試輸出隨機驗證碼。 $params['TemplateParam'] = Array ( "code" => $code, ); // fixme 可選: 設定傳送簡訊流水號 // $params['OutId'] = "12345"; //這裡我沒用就把它註釋掉了 // fixme 可選: 上行簡訊擴充套件碼, 擴充套件碼欄位控制在7位或以下，無特殊需求使用者請忽略此欄位 // $params['SmsUpExtendCode'] = "1234567"; //這裡我沒用就把它註釋掉了 // *** 需使用者填寫部分結束, 以下程式碼若無必要無需更改 *** if(!empty($params["TemplateParam"]) && is_array($params["TemplateParam"])) { $params["TemplateParam"] = json_encode($params["TemplateParam"], JSON_UNESCAPED_UNICODE); } // 初始化SignatureHelper例項用於設定引數，簽名以及傳送請求 $helper = new SignatureHelper(); // 此處可能會丟擲異常，注意catch $content = $helper->request( $accessKeyId, $accessKeySecret, "dysmsapi.aliyuncs.com", array_merge($params, array( "RegionId" => "cn-hangzhou", "Action" => "SendSms", "Version" => "2017-05-25", )) // fixme 選填: 啟用https // ,true ); //echo '<pre>'; //測試 //print_r($content); return $content; } /** * @param int $len * @return string * 隨機生成驗證碼 */ private function Getcode($len=6){ return str_pad(mt_rand(1,pow(10,$len)-1),$len,STR_PAD_LEFT); }
然後咱們再瞭解一下生成隨機碼的函式
str_pad(mt_rand(1,pow(10,$len)-1),$len,STR_PAD_LEFT)把字串填充為新的長度：mt_rand(1,pow(10,$len)-1): 如果隨機到1000000會多出一位，我們-1讓它變成999999
$len:要生成的長度，如果大於左側的數，會自動補全。