最近遇到的項目須要個隨機短信驗證碼實現註冊用戶java
選用的是「雲信使」,由於有15條免費的測試短信能夠驗證代碼是否正確調用該短信apiajax
進入短信平臺api
用戶認證完成後,建立一個驗證碼的短信模板dom
等待審覈異步
往下拉jsp
在項目中引入MessageLogController.java async
分析MessageLogController.java 代碼,能夠發現其實就是 發送一個http請求測試
咱們也能夠本身寫一個java http請求,。。能夠在註冊頁面獲取手機號和隨機數後經過ajax異步請求一個jsp頁面,傳入要發送給的手機號碼和隨機數,而後這個jsp 調用java http請求便可發送spa
官方SDK:3d
如下,是 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>