關於手機短信接收驗證碼的實現原理:
思路:
A:獲得驗證碼:
1.找到相關的表。
2.用什么發送,post,get ,ajax,當然ajax首選
3.post之前要js先判斷是手機號碼11位,並且全部都是數字,或者用正則也行。
4.用ajax發送數據data,要對數據進行檢驗,過濾有效數據valid
5.insert前要先判斷這手機是否驗證過了,已經驗證過就return false;沒驗證過則把隨機生成的6位驗證碼insert 數據庫表中。
6.通過提供給你api寫好調用,把驗證碼跟msg通過ajax返回值發送給向客戶,並用js做一個倒計時計數器.
B:接收驗證碼,提交表單:
1.接收post過來數據,把驗證碼跟跟剛才插入數據庫中的6位key進行比較。如果相等,則說明是最后一次發送的驗證碼才有效。
2.對數據庫insert 操作.最少要做個認證tag標志.
先貼出html部分:
<!--手機認證 Begin--> <div style="display: block;" class="auth_ck_detail" id="auth_ck_phone"> <div class="item_title item_margin"><p>手機認證</p><span class="shadow"></span></div> <form name="myform" id="myform" action="http://www.hnb.cc/jiaoyou/usercp.php?c=certify&a=rzmobile" method="post"> <table class="user-table table-margin lh35" border="0" cellpadding="0" cellspacing="0" width="98%"> <tbody> <tr> <td class="lblock" width="15%">您的手機號碼:</td> <td class="rblock" width="85%"> <input name="mobile" id="mobile" value="" class="input-150" type="text" style="width:130px;"> <input name="btn_downtime" id="btn_downtime" value="免費獲取驗證碼" style="height: 25px; background:#F5487A; color:#fff; padding-left: 2px; padding-right: 5px; width:175px;" class="button-green-b" type="button"> <span id="tips_mobile"></span> <br> <div class="mb-verifycode" style=" width:320px; background:#FFDD55;margin-top:10px; color:#666666; padding-left:10px; padding-bottom:5px;" > <p style="font-size:13px;">輸入以下圖片校驗碼才可以獲取手機驗證碼</p> <dl style=" float:left;"> <dt style=" float:left;">校驗碼:</dt> <dd style=" float:left; "><input style="width:100px; " value="" name="mbverifycode" id="mbverifycode" maxlength="6" type="text"> <img id="verifycode-img" src="#" style="vertical-align: middle;"> <span id="btn_mbverifycode" >換一個</span></dd> <div style="clear: both;"></div> </dl> <div style="clear: both;"></div> </div> </td> </tr> <tr> <td class="lblock">收到的驗證碼:</td> <td class="rblock"><input value="" name="checkcode" id="checkcode" class="input-s" type="text"> <font color="#df4070">(輸入您手機收到的驗證碼)</font></td> </tr> <tr> <td class="lblock" height="40"></td> <td class="rblock"><input value="提交驗證" onclick="return checkrzmobile();" class="button-gray" type="button"></td> </tr> </tbody> </table> </form> <table class="user-table table-margin lh25" border="0" cellpadding="0" cellspacing="0" width="98%"> <tbody><tr> <td> 為什么要進行手機認證?<br> 1、認證通過后可在您的資料頁點亮手機認證圖標,提高你的誠信等級;<br> 2、接收來自網站和會員發送的手機短信。<br> </td> </tr> </tbody></table> <script type="text/javascript"> //處理手機驗證碼 $("#verifycode-img").attr("src", "/jiaoyou/source/include/imagecode.php?act=verifycode&t_code="+(new Date()).getTime()); $(function() { $("#btn_mbverifycode").click(function() { $("#verifycode-img").attr("src", "/jiaoyou/source/include/imagecode.php?act=verifycode&t_code="+(new Date()).getTime()); return false; }); $("#btn_downtime").click(function() { //獲取手機驗證碼 var tips = $("#tips_mobile"); var args_mobile = $("#mobile").val(); var args_mbverifycode = $("#mbverifycode").val(); if (!isMobile(args_mobile)) { tips.html('請填寫正確的手機號碼'); return false; } $.ajax({ type: 'POST', //jiaoyou/index.php?c=ajax&a=checkregmobile // url:"/jiaoyou/index.php?c=ajax", url:"/jiaoyou/usercp.php?c=certify", cache: false, data: {a:"checkregmobile", mobile: args_mobile, verifycode:args_mbverifycode, r: get_rndnum(8)}, dataType: 'json', success: function(data) { var json = eval(data); var response = json.response; var result = json.msg; // alert(json.response); if (response == "1") { initGetDownTime('mobile', 'btn_downtime');/*時間倒計時*/ tips.html("<font color='green'>驗證碼發送成功,請注意查收。</font>"); } else { if (result.length > 0) { tips.html("<font color='red'>"+result+"</font>"); } else { tips.html("<font color='red'>發送失敗,請檢查手機號。</font>"); } } }, error: function() { tips.html("<font color='red'>請求錯誤</font>"); } }); }); }); /*----------------- 倒計時 start ----------------*/ var init_down_time = 60; var init_intervalDownTimeObj; /** * 倒計時 * @param:: string mbinput */ function initGetDownTime(mbinput, btnobj) { var mb = $("#"+mbinput).val(); if (isMobile(mb)) { init_intervalDownTimeObj = setInterval("countDownTime('"+btnobj+"')", 1000); } } function countDownTime(btn) { $('#'+btn).attr("disabled", "true"); $('#'+btn).val(""+init_down_time+"秒后沒收到短信重新發送"); init_down_time--; if (init_down_time == 0){ clearInterval(init_intervalDownTimeObj); //停止時間 $('#'+btn).removeAttr("disabled"); $('#'+btn).val("重新發送"); init_down_time = 60; } } /*----------------- 倒計時 end ----------------*/ </script> </div> <!--//手機認證 End-->
A:
下面php接收ajax接收方法:
/*hnb新增加的手機接收驗證方法*/ public function control_checkregmobile( ) { $response = 0; $mobile = XRequest::getArgs('mobile');/*得到手機號 這個跟$_post接收數據是一樣的*/ $checkcode = XRequest::getArgs('verifycode');/*得到驗證碼這個跟$_post接收數據是一樣的*/ if (!empty($checkcode)) { parent::loadUtil('session'); $nowcode = XSession::get('verifycode'); if ($checkcode!== $nowcode) { echo json_encode(array('response' => $response,'msg'=>'您的校驗碼有誤!'));exit; } }else { echo json_encode(array('response' => $response,'msg'=>'您的校驗碼有誤!'));exit; } $model = parent::model('user','am'); $target = "http://api.bjszrk.com/sdk/BatchSend.aspx"; /*接口url*/ if (true === $model->doExistsMobile($mobile)) /*檢測手機是否已經驗證*/ { $response = 2; $msg='對不起,您的手機號碼已經通過驗證,請不要重復操作!'; }else { $model_certify = parent::model('certify', 'um'); list($mbcode, $error) = $model_certify->GetMobileCode($mobile); /*生成一個隨機數及插入數據*/ $content="您的驗證碼是:".$mbcode."。歡迎注冊我主良緣交友網,請勿將驗證碼告知他人!"; $msg=$model->postMbCode($mobile, $content); /*調用post給api接口方法*/ $response = 1; $msg='驗證碼已發送成功,請注意查收!'; } echo json_encode(array('response'=>$response,'msg'=>$msg)); }
檢測手機是否已經驗證過的doExistsMobile方法如下:
public function doExistsMobile($mobile) { $res = false; $sql = 'SELECT `userid` FROM ' . DB_PREFIX . 'user_attr' . " WHERE `mobile`='{$mobile}'"; $rows = parent::$obj->fetch_first($sql); if (!empty($rows)) { $res = true; } unset($sql, $rows); return $res; }
/*GetMobileCode方法具體實現如下:*/
/*r把隨機得到的6位驗證碼insert到數據庫表中*/ public function GetMobileCode($mobile) { $result = 0; $message = null; $checkcode = XHandle::getRndChar(6, 1); $userid=parent::$wrap_user['userid']; $sql="update user_status set mobilesalt='$checkcode' where userid='$userid'"; parent::$obj->query($sql); $result = 1; $sql = (('SELECT * FROM ' . DB_PREFIX) . 'mobile_checkcode') . " WHERE `mobile`='{$mobile}'"; $rows = parent::$obj->fetch_first($sql); if (!empty($rows)) { $array = array('checkcode' => $checkcode, 'updatetime' => time()); parent::$obj->update(DB_PREFIX . 'mobile_checkcode', $array, ('`id`=\'' . $rows['id']) . '\''); } else { $id = parent::$obj->fetch_newid(('SELECT MAX(id) FROM ' . DB_PREFIX) . 'mobile_checkcode', 1); $array = array('id' => $id, 'mobile' => $mobile, 'checkcode' => $checkcode, 'createtime' => time()); parent::$obj->insert(DB_PREFIX . 'mobile_checkcode', $array); } unset($sql); unset($rows); return array($checkcode, $message); }
B:
下面是得到了驗證碼Form表單點提交php的方法.
submit提交 */ public function control_rzmobile( ) { $service = parent::service( "certify", "us" );/*接收數據,驗證手機格式及號碼*/ list( $mobile, $salt ) = $service->validRzMobile( );/*salt 為手機驗證碼*/ unset( $service ); $model = parent::model( "certify", "um" ); $result = $model->doValidMobile( $mobile, $salt ); /*調用model三張表進行數據操作*/ unset( $model ); if ( TRUE === $result ) { if ( $this->halttype == "jdbox" ) { XHandle::jqdialog( "手機號碼驗證成功", 1 ); } else { XHandle::halt( "手機號碼驗證成功", $this->ucfile."?c=certify", 0 ); } } else { XHandle::halt( "手機號碼驗證失敗", "", 1 ); } }
上面dovalidmobile函數方法具體實現:
/*手機認證提交 分別在三個表里操作對象*/ public function doValidMobile( $mobile, $validkey ) { $result = FALSE; $sql = "SELECT userid FROM ".DB_PREFIX.( "user_status WHERE mobilesalt='".$validkey."' AND userid='" ).parent::$wrap_user['userid']."'"; //SELECT userid FROM user_status WHERE mobilesalt='5522' AND userid='209367' $rows = parent::$obj->fetch_first( $sql ); if ( !empty( $rows ) ) { $status_array = array( "mobilerz" => 1, "mobilesalt" => XHandle::getrndchar( 6, 1 ) ); // print_r($status_array);exit; parent::$obj->update( DB_PREFIX."user_status", $status_array, "userid='".parent::$wrap_user['userid']."'" ); $attr_array = array( "mobile" => $mobile ); parent::$obj->update( DB_PREFIX."user_attr", $attr_array, "userid='".parent::$wrap_user['userid']."'" ); parent::loadlib( "user" ); $star = XUser::updatestar( parent::$wrap_user['userid'] ); /*加星為user_status表里設置star星級*/ $result = TRUE; if ( TRUE === $result ) { $m_indexs = parent::model( "indexs", "am" ); /*作用在user_params表里加上論證標志,可能是用戶左邊欄加上星標志*/ $m_indexs->updateIndexs( parent::$wrap_user['userid'], array( "rzmobile" => 1, "star" => $star ) ); unset( $m_indexs ); } } return $result; }