The whole process and code of the implementation of SMS verification code for mobile phone registration in Web project

Recently in doing only the background user management system purifier, need to use mobile phone number to register, looked for a long time to understand the mobile phone verification code implementation process, today and share with you.

We are using the hazelnut cloud SMS platform, website address: http://smsow.zhenzikj.com

I'm a Java developer, the backend uses SPRINGMVC, the front end is JSP + jquery

SMS Verification Code implementation process

1, constructs the mobile phone verification code, produces a 6-bit random number string;
2, using the interface to the SMS platform to send mobile phone number and verification code, and then the SMS platform to send verification code to the development of mobile phone number
3, the mobile phone number verification code, operation time into the session, as the latter to verify the use;
4, receive the user to fill in the verification code, mobile phone number and other registration data;
5, compare the verification code submitted with the session of the verification code is consistent, and determine whether the submission action is within the validity period;
6, the verification code is correct and within the validity period, the request passes, handles the corresponding business.

Front-end pages

Jsp

<%@ page language= "java" contenttype= "text/html;    Charset=utf-8 "pageencoding=" UTF-8 "%><%string path = Request.getcontextpath (); String basepath = request.getscheme () + "://" +request.getservername () + ":" +request.getserverport () +path;%><! DOCTYPE html>
　　
Js
$ (function () {//Send verification code $ (". Sendverifycode"). On ("click", Function () {var number = $ ("Input[name=number]"). Val (); $.ajax ( {Url:getbasepath () + "/sendsms.html", Async:true, type: "Post", DataType: "JSON", DAT        A: {"number": Number}, Success:function (data) {if (data = = ' fail ') {alert ("Failed to send verification code");        return; }        }    });}) Submit $ (". Sub-btn"). On ("click", Function () {var data = {};d Ata.userid = $.trim ($ ("Input[name=userid]"). Val ()); Data.password = $.trim ($ ("Input[name=password]"). Val ());d Ata.number = $.trim ($ ("Input[name=number]"). Val ()); Data.verifycode = $.trim ($ ("Input[name=verifycode]"). Val ()); $.ajax ({Url:getbasepath () + "/register.html", as Ync:true, type: "Post", DataType: "JSON", Data:data, Success:function (data) {if (d        ATA = = ' fail ') {alert ("Failed to register");        return;        } alert ("Registered successfully"); }    });})});
　　
All non-empty, cell phone number format verification is omitted here.
Process:
1) Fill in the phone number
2) Get mobile phone number, call Sendsms.html interface to send SMS verification code to mobile phone
3) After the user phone receives the verification code, fills it in the "Captcha" text box
Back-end Code
Send SMS Verification Code
/** * Send SMS Verification code * @param number to receive mobile numbers */@RequestMapping ("/sendsms") @ResponseBodypublic Object sendsms (httpservletrequest Request, string number) {try {jsonobject JSON = null;//generates a 6-bit code String Verifycode = string.valueof (new Random (). Nextint (899 999) + 100000);//Send SMS Zhenzismsclient client = new Zhenzismsclient ("Your AppID", "Your Appsecret"); String result = client.send (number, "Your Verification code is:" + Verifycode + ", the code is valid for 5 minutes, the code can only be used once!) "SMS Signature"), JSON = Jsonobject.parseobject (Result), if (Json.getintvalue ("code") = = 0)//Send SMS failed return "fail";// The verification code is stored in the session and stored in the creation time//in JSON, where Ali's fastjsonhttpsession session = Request.getsession () is used; json = new Jsonobject () ; Json.put ("Verifycode", Verifycode); Json.put ("Createtime", System.currenttimemillis ());// Deposit the authentication code in Sessionrequest.getsession (). SetAttribute ("Verifycode", JSON); return "Success";} catch (Exception e) {e.printstacktrace ();} return null;}
　　
Submit Registration
/** * * Register */@RequestMapping ("/register") @ResponseBodypublic Object Register (httpservletrequest request, String UserId, string password, string number,string verifycode) {jsonobject json = (jsonobject) request.getsession (). getattribute (" Verifycode "), if (!json.getstring (" Verifycode "). Equals (Verifycode)) {return" Authenticode error ";} if ((System.currenttimemillis ()-Json.getlong ("Createtime") > + * 5) {return "Verification code expires";} Save user information in database//Omit return "success" here;}
　　
The whole process and code of the implementation of SMS verification code for mobile phone registration in Web project