登録機能は多くの Web サイトにとって必須の機能です。登録機能がある場合は、SMS 認証コードが必要です。興味のある方は、thinkphp が SMS 認証登録機能を実装する方法を説明します。
はじめに
この記事では、多くの場合、SMS 認証コードが必要になる場合があります。
SMS 検証プラットフォームは Yunpian を使用し、SMS 検証コードは thinkphp を使用して生成されます。
アイデア
1. ユーザーは携帯電話番号を入力し、SMS 認証コードの取得を要求します。
2. thinkphp は SMS 検証コードを生成して保存し、他のパラメーターとともにリクエストを Yunpian に送信します。
3. Yunpian は指定された携帯電話番号にテキスト メッセージ確認コードを送信します。
4. ユーザーは SMS 認証コードを入力します。
5. thinkphp は、検証コードが正しいかどうか、および検証コードの有効期限が切れているかどうかの 2 つの条件に基づいて検証に合格するかどうかを判断します。
コード実装
検証インターフェース
インターフェースアドレス: https://sms.yunpian.com/v1/sms/send.json。
postman を使用して、必要な 3 つのパラメータ apikey、mobile、text を入力します。
phpはhttp/httpsリクエストを開始します
phpのcurl関数を使用してhttpsリクエストを開始し、パラメータapikey、mobile、textを取り込みます。
// 获取短信验证码 public function getSMSCode(){ // create curl resource $ch = curl_init(); // set url $url = 'https://sms.yunpian.com/v1/sms/send.json'; curl_setopt($ch, CURLOPT_URL, $url); // set param $paramArr = array( 'apikey' => '******', 'mobile' => '******', 'text' => '【小太阳】您的验证码是1234' ); $param = ''; foreach ($paramArr as $key => $value) { $param .= urlencode($key).'='.urlencode($value).'&'; } $param = substr($param, 0, strlen($param)-1); curl_setopt($ch, CURLOPT_POSTFIELDS, $param); curl_setopt($ch, CURLOPT_HEADER, 0); curl_setopt($ch, CURLOPT_POST, 1); //curl默认不支持https协议,设置不验证协议 curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false); curl_setopt($ch, CURLOPT_SSL_VERIFYHOST, false); //return the transfer as a string curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1); // $output contains the output string $output = curl_exec($ch); // close curl resource to free up system resources curl_close($ch); echo $output; }
ランダムなSMS確認コードを生成する
デフォルトで4桁のランダムなSMS確認コードを生成します。
// 生成短信验证码 public function createSMSCode($length = 4){ $min = pow(10 , ($length - 1)); $max = pow(10, $length) - 1; return rand($min, $max); }
統合
データベースに新しいテーブルsun_smscodeを作成します:
DROP TABLE IF EXISTS `sun_smscode`; CREATE TABLE `sun_smscode` ( `id` int(8) NOT NULL AUTO_INCREMENT, `mobile` varchar(11) NOT NULL, `code` int(4) NOT NULL, `create_at` datetime NOT NULL, `update_at` datetime NOT NULL, PRIMARY KEY (`id`) ) ENGINE=MyISAM AUTO_INCREMENT=3 DEFAULT CHARSET=utf8; thinkphp代码: // 获取短信验证码 public function getSMSCode(){ // create curl resource $ch = curl_init(); // set url $url = 'https://sms.yunpian.com/v1/sms/send.json'; curl_setopt($ch, CURLOPT_URL, $url); // set param $mobile = $_POST['mobile']; $code = $this->createSMSCode(); $paramArr = array( 'apikey' => '******', 'mobile' => $mobile, 'text' => '【小太阳】您的验证码是'.$code ); $param = ''; foreach ($paramArr as $key => $value) { $param .= urlencode($key).'='.urlencode($value).'&'; } $param = substr($param, 0, strlen($param)-1); curl_setopt($ch, CURLOPT_POSTFIELDS, $param); curl_setopt($ch, CURLOPT_HEADER, 0); curl_setopt($ch, CURLOPT_POST, 1); curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false); //不验证证书下同 curl_setopt($ch, CURLOPT_SSL_VERIFYHOST, false); //return the transfer as a string curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1); // $output contains the output string $output = curl_exec($ch); // close curl resource to free up system resources curl_close($ch); //$outputJson = json_decode($output); $outputArr = json_decode($output, true); //echo $outputJson->code; //echo $outputArr['code']; if($outputArr['code'] == '0'){ $data['mobile'] = $mobile; $data['code'] = $code; $smscode = D('smscode'); $smscodeObj = $smscode->where("mobile='$mobile'")->find(); if($smscodeObj){ $data['update_at'] = date('Y-m-d H:i:s'); $success = $smscode->where("mobile='$mobile'")->save($data); if($success !== false){ $result = array( 'code' => '0', 'ext' => '修改成功', 'obj' => $smscodeObj ); } echo json_encode($result,JSON_UNESCAPED_UNICODE); }else{ $data['create_at'] = date('Y-m-d H:i:s'); $data['update_at'] = $data['create_at']; if($smscode->create($data)){ $id = $smscode->add(); if($id){ $smscode_temp = $smscode->where("id='$id'")->find(); $result = array( 'code'=> '0', 'ext'=> '创建成功', 'obj'=>$smscode_temp ); echo json_encode($result,JSON_UNESCAPED_UNICODE); } } } } }
SMS確認コードの有効期限が切れているかどうかを確認します、SMS が送信されているかどうかを確認します。確認コードは正しいです。
// 验证短信验证码是否有效 public function checkSMSCode(){ $mobile = $_POST['mobile']; $code = $_POST['code']; $nowTimeStr = date('Y-m-d H:i:s'); $smscode = D('smscode'); $smscodeObj = $smscode->where("mobile='$mobile'")->find(); if($smscodeObj){ $smsCodeTimeStr = $smscodeObj['update_at']; $recordCode = $smscodeObj['code']; $flag = $this->checkTime($nowTimeStr, $smsCodeTimeStr); if(!$flag){ $result = array( 'code' => '1', 'ext' => '验证码过期,请刷新后重新获取' ); echo json_encode($result,JSON_UNESCAPED_UNICODE); return; } if($code != $recordCode){ $result = array( 'code' => '2', 'ext' => '验证码错误,请重新输入' ); echo json_encode($result,JSON_UNESCAPED_UNICODE); return; } $result = array( 'code' => '0', 'ext' => '验证通过' ); echo json_encode($result,JSON_UNESCAPED_UNICODE); } } // 验证验证码时间是否过期 public function checkTime($nowTimeStr,$smsCodeTimeStr){ //$nowTimeStr = '2016-10-15 14:39:59'; //$smsCodeTimeStr = '2016-10-15 14:30:00'; $nowTime = strtotime($nowTimeStr); $smsCodeTime = strtotime($smsCodeTimeStr); $period = floor(($nowTime-$smsCodeTime)/60); //60s if($period>=0 && $period<=20){ return true; }else{ return false; } }
改善点
SMS爆撃を防ぐため、SMS認証コードの取得リクエスト時に画像認証コードを追加する必要があります。
thinkphpは画像検証コードを生成する機能を提供しています。検証コードの生成、更新、検証を実装してみましょう。
画像検証コードの生成と更新
// 获取图片验证码,刷新图片验证码
public function getPicCode(){
$config = array(
'fontSize'=>30, // 验证码字体大小
'length'=>4, // 验证码位数
'useNoise'=>false, // 关闭验证码杂点
'expire'=>600
);
$Verify = new \Think\Verify($config);
$Verify->entry(2333);//2333是验证码标志
}
この関数の対応する URL が http://localhost/owner-bd/index.php/Home/CheckCode/getPicCode であると仮定すると、次のようになります。画像 認証コードのアドレスはこのURLで、ページ画像タグのsrc属性に入れるだけです。
画像認証コードを確認する
// 验证验证码是否正确
public function checkPicCode($code){
$verify = new \Think\Verify();
if($verify->check($code, 2333)){
$result = array(
'code' => '0',
'ext' => '验证通过'
);
echo json_encode($result,JSON_UNESCAPED_UNICODE);
}else{
$result = array(
'code' => '1',
'ext' => '验证码错误,请重新输入'
);
echo json_encode($result,JSON_UNESCAPED_UNICODE);
};
}
上記の方法では、実装が非常に簡単な thinkphp が提供する check メソッドを使用します。ただし、検証の詳細を取得したい場合は、他に方法はありません。たとえば、認証コードが間違っている場合、認証コードがタイムアウトした、認証コードが間違って入力された、認証コードが使用されたなどの可能性があります。必要に応じて、thinkphp の検証コード クラスを書き換えたり、thinkphp の check メソッドを書き換えたりできます。
フロントエンドとバックエンドを実行します
バックエンドは、verify image検証コード関数を変更し、呼び出される関数に変更しました:
public function checkPicCode($picCode){ $verify = new \Think\Verify(); if($verify->check($picCode, 2333)){ return true; }else{ return false; }; }
SMS 検証コードを取得する関数、イメージ検証への呼び出しを追加する code 関数は、検証に合格した後にのみリクエストを Yunpian に送信します。
// 获取短信验证码 public function getSMSCode(){ $picCode = $_POST['picCode']; if(!$this->checkPicCode($picCode)){ $result = array( 'code' => '1', 'ext' => '验证码错误,请重新输入' ); echo json_encode($result,JSON_UNESCAPED_UNICODE); return; } /*省略*/ }
フロントエンドコアコード
<!--register.html--> <!DOCTYPE html> <html lang="zh" ng-app="sunApp"> <head> <meta charset="UTF-8"> <title>注册</title> </head> <body ng-controller="registerController"> <form action="" class="register-form" ng-show="isShow1"> <p class="input-group"> <input type="text" class="mobile" ng-model="mobile" placeholder="手机号"> </p> <p class="input-group"> <input type="text" class="pic-code" ng-model="picCode" placeholder="图片验证码"> <img class="img" src="{{picCodeUrl}}" alt="" ng-click="refresh()"> </p> <p class="input-group"> <input type="text" class="sms-code" ng-model="SMSCode" placeholder="短信验证码"> <button class="btn-sms" ng-click="getSMSCode()" ng-disabled="btnSMSDisabled">{{btnSMSText}}</button> </p> <button class="confirm-btn" ng-click="next()">下一步</button> </form> <form action="" class="register-form" ng-show="isShow2"> <p class="input-group"> <input type="text" class="mobile" ng-model="mobile" placeholder="手机号" disabled="true"> </p> <p class="input-group"> <input type="password" class="password" ng-model="password" placeholder="请输入密码"> <input type="password" class="password" ng-model="password2" placeholder="请再次输入密码"> </p> <button class="confirm-btn" ng-click="getSMSCode()">注册</button> </form> </body> </html> // register.js angular.module('sunApp').controller('registerController', function ($scope,$http,$httpParamSerializer,$state,$interval) { $scope.picCodeUrl = '/owner-bd/index.php/Home/CheckCode/getPicCode'; $scope.isShow1 = true; $scope.isShow2 = false; $scope.btnSMSText = '获取验证码'; $scope.btnSMSDisabled = false; $scope.checkOver = false; // 获取短信验证码 $scope.getSMSCode = function(){ var param = { mobile: $scope.mobile, picCode: $scope.picCode }; $http({ method:'POST', url:'/owner-bd/index.php/Home/SMS/getSMSCode', //url: '/owner-fd/mock/common.json', headers:{ 'Content-Type':'application/x-www-form-urlencoded' }, dataType: 'json', data: $httpParamSerializer(param) }).then(function successCallback(response) { console.log(response.data); if(response.data.code == '0'){ $scope.checkOver = true; $scope.btnSMSDisabled = true; var time = 60; var timer = null; timer = $interval(function(){ time = time - 1; $scope.btnSMSText = time+'秒'; if(time == 0) { $interval.cancel(timer); $scope.btnSMSDisabled = false; $scope.btnSMSText = '重新获取'; } }, 1000); } }, function errorCallback(response) { console.log(response.data); }); } // 验证短信验证码 $scope.next = function(){ if(!$scope.checkOver){ console.log('未通过验证'); return; } var param = { mobile: $scope.mobile, code: $scope.SMSCode }; $http({ method:'POST', url:'/owner-bd/index.php/Home/SMS/checkSMSCode', //url: '/owner-fd/mock/common.json', headers:{ 'Content-Type':'application/x-www-form-urlencoded' }, dataType: 'json', data: $httpParamSerializer(param) }).then(function successCallback(response) { console.log(response.data); if(response.data.code == '0'){ $scope.isShow1 = false; $scope.isShow2 = true; } }, function errorCallback(response) { console.log(response.data); }); } // 刷新图片验证码 $scope.refresh = function(){ $scope.picCodeUrl = '/owner-bd/index.php/Home/CheckCode/getPicCode?'+Math.random(); } });
最適化
上記のコードは、フロントエンド検証をバイパスするツールを使用できます。この問題を回避するには、checkPicCode 関数と checkSMSCode 関数でマークするセッション値を追加します。
$_SESSION['checkPicCode'] = true; $_SESSION['checkSMSCode'] = true;
最後のステップでは、データベースにユーザーを追加するときに、まず両方のセッション値が true であるかどうかを確認し、両方が true の場合に追加します。
成果
追記将来役に立つかもしれないコード:echo json_encode($_SESSION);// 打印出session中的数据 echo session_id();// 打印当前session的id
概要: 以上がこの記事の全内容です、皆さんの学習に役立てば幸いです。
関連する推奨事項:
PHP での in_array 暗黙的変換の実装手順の詳細な説明 ローカル JSON ファイルを読み取る方法とは以上がSMS認証登録機能を実装するThinkphpメソッドの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。