短信驗證碼api

最近遇到的項目需要個隨機短信驗證碼實現注冊用戶

選用的是“雲信使”，因為有15條免費的測試短信可以驗證代碼是否正確調用該短信api

地址

進入短信平台

一、實名認證 + 短信模板

用戶認證完成后，創建一個驗證碼的短信模板

 

 等待審核

二、下載SDK示例文檔

往下拉

在項目中引入MessageLogController.java 

 

 分析MessageLogController.java 代碼，可以發現其實就是 發送一個http請求

 

 

我們也可以自己寫一個java http請求,。。可以在注冊頁面獲取手機號和隨機數后通過ajax異步請求一個jsp頁面，傳入要發送給的手機號碼和隨機數，然后這個jsp 調用java http請求即可發送

官方SDK：

 

 

以下，是 6位數字 驗證碼生成  +  由login.jsp 文件 ajax 請求到 sedMess.jsp + 倒計時重新發送提示 + 驗證輸入的驗證碼 是否和 發送的驗證碼相同

【通過全局變量保留 生成的隨機數 用於 和用戶輸入的驗證碼相對比】

<script>

    var number = "";
                function shortMessagraxc() {
                    var xx = document.getElementById("newphone").value;
                    if(xx == ""){
                        alert("請輸入手機號碼！");
                    }else{
                        var num ="";
                         for(var i = 0;i < 6;i++){
                              num += Math.floor(Math.random()*10);
                         }
                         alert(xx+" "+num);
                         
                        var xmlhttp = new XMLHttpRequest();
                        xmlhttp.open("POST","sedMess.jsp?number="+num+"&phone="+xx,true);
                        xmlhttp.send();
                        
                        //修改全局變量
                        $.ajax({
                            async: false,
                            success: function() {
                                number = num;
                            }
                        })
                        
                       //alert(number);//檢測全局變量 是否被修改
                        var count = 10;
                        var countdown = setInterval(CountDown, 1000);
                        function CountDown() {
                            $(".btn_yzm").attr("disabled", true);
                            $(".btn_yzm").val("" + count + "s");
                            if (count == 0) {
                                $(".btn_yzm").val("重新獲取").removeAttr("disabled");
                                clearInterval(countdown);
                            }
                            count--;
                        }
                    }
                    
            
            };
            
            function checkM(){
                //alert(number);     //檢測全局變量 是否被修改
                var yxy = document.getElementById("yanZM").value;
                if( yxy == null){
                    alert("請輸入驗證碼");
                    return false;
                }else if(yxy != number){
                    alert("請輸入正確驗證碼");
                    document.getElementById("yanZM").value = "";
                    return false;
                }else{
                    return true;
                }
            }
            
</script>