最近在開發一個登入模組，需要用到簡訊驗證碼功能，由於技術有限，簡單做了一個比較粗糙的，寫下來備忘。需要用到：Jq-ajax、php、簡訊寶

HTML部分：

<div class="login">
    <div class="login-head">
        <p>註冊使用者</p>
        <p>成為IM的使用者</p>
    </div>
    <div class="login-main">
        <p class="log-err">&nbsp;</p
 
>
        <input type="text" name="user_name" placeholder="使用者名稱" autocomplete="off" />
        <input type="password" name="user_pass" placeholder="密碼" autocomplete="off" />
        <!--<input type="text" name="user_mail" placeholder="郵箱 (選填)" autocomplete="off" />-->
        <input
 
 type="text" name="user_tel" placeholder="手機" autocomplete="off" class="vcode" />
        <button class="getcode">獲取驗證碼</button>
        <input type="text" placeholder="簡訊驗證碼" autocomplete="off" />
        <button class="submit">註冊</button>
    </div>
    <div class
 
="login-qrcode">
        <img src="../img/qrcode.png" />
    </div>
    <div class="login-link">
        <a href="../login/">登入賬戶</a>
        <a href="">使用者協議</a>
    </div>
</div>

向伺服器傳送驗證碼：

$(".getcode").click(function(){
    var _input = $(".login-main").find("input");
    if(_input.eq(2).val() == ''){
        $(".log-err").text("請輸入手機號碼");
        return false;
    }else{
        var tel_num = _input.eq(2).val();
        show_num = Math.round(Math.random()*1000000);
        while(show_num < 99999){
            show_num = Math.round(Math.random()*1000000);
        }
        $.ajax({
            type: "post",
            url: "sendmsg.php",
            data: "tel_num=" + tel_num + "&" + "show_num=" + show_num,
            beforeSend: function(){
                $(".getcode").text("正在傳送...");
            },
            success: function(data){ //ajax執行成功回撥函式，判斷髮送驗證碼是否成功
                if(data){
                    $(".getcode").text("驗證碼已傳送");
                }else{
                    $(".getcode").text("驗證碼傳送失敗");
                }
            }
        });
    }
})

簡訊寶API：

<?php
    $statusStr = array(
    "0" => "傳送成功",
    "-1" => "傳送失敗"
    );
    $smsapi = "http://api.smsbao.com/";
    $user = "*你的賬號***"; //簡訊平臺帳號
    $pass = md5("你的密碼 MD5加密"); //簡訊平臺密碼
    $content="【IM】歡迎您的註冊，您的驗證碼是".$_POST['show_num'];//要傳送的簡訊內容
    $phone = $_POST['tel_num'];//要傳送簡訊的手機號碼
    $sendurl = $smsapi."sms?u=".$user."&p=".$pass."&m=".$phone."&c=".urlencode($content);
    $result =file_get_contents($sendurl) ;
    echo $statusStr[$result];
?>

簡訊寶API詳細文件：簡訊寶API

客戶端驗證：

$(".submit").click(function(){
$(".log-err").text("");
    var _input = $(".login-main").find("input");
    var vcode_num = $(".show-vcode").text();
    if(_input.eq(0).val() == ''){
        $(".log-err").text("請輸入使用者名稱");
        return false;
    }else if(_input.eq(1).val() == ''){
        $(".log-err").text("請輸入密碼");
        return false;
    }else if(_input.eq(2).val() == ''){
        $(".log-err").text("請輸入手機號碼");
        return false;
    }else if(_input.eq(3).val() == ''){
        $(".log-err").text("請輸入驗證碼");
        return false;
    }else{
        if(_input.eq(3).val() != show_num){
            $(".log-err").text("驗證碼錯誤");
            return false;
        }else{
            var username = _input.eq(0).val();
            var userpass = _input.eq(1).val();
            var usertel = _input.eq(2).val();
            $.ajax({
            type: "post",
            url: "reg.php",
            data: "au_name=" + username + "&au_pass=" + userpass + "&au_tel=" + usertel,
            beforeSend: function(){
                $(".submit").text("正在註冊...");
            },
            success: function(data){ //ajax執行成功回撥函式，判斷是否登陸成功
                if(data){
                    alert("註冊成功");
                    window.location.href = "../login/";
                }else{
                    alert("註冊失敗");
                    window.location.href = "index.php";
                }
            }
        });
        }

    }
})

驗證通過註冊使用者：

<?php
    $au_name = $_POST['au_name'];
    $au_pass = $_POST['au_pass'];
    $au_tel = $_POST['au_tel'];
    include '../inc/mysqli.php';
    $sql = "INSERT INTO im_au (au_name,au_pass,au_tel) VALUES ('$au_name','$au_pass','$au_tel')";
    $res = $mysqli -> query($sql);
    $res_sel = $mysqli -> query("SELECT * FROM im_au where au_name = '$au_name' and au_pass = '$au_pass'");
    $row = $res_sel -> fetch_array();
    if($row){
        echo true;
    }else{
        echo false;
    }
    mysqli_close($mysqli);
?>