ThinkPHP3.2.3 Verification code display, refresh, check

Show Verification Code

First create a public controller under Home/controller Publiccontroller

1<?PHP2 namespace Home\controller;3 4  UseThink\controller;5  Usethink\verify;6 7 classPubliccontrollerextendsController8 {9 Ten     /*Generate verification Code*/ One      Public functionVerify () A     { -         $config= [ -' FontSize ' = 19,//captcha Font Size the' Length ' = 4,//Verify number of code bits -' Imageh ' = 34 -         ]; -         $Verify=NewVerify ($config); +         $Verify-entry (); -     } +  A     /*Verification Code Check*/ at      Public functionCheck_verify ($code,$id= ' ') -     { -         $verify=New\think\verify (); -         $res=$verify->check ($code,$id); -         $this->ajaxreturn ($res, ' JSON '); -     } in}

The Verify function is used to generate a verification code, which is used to configure the properties of the display verification code. What are the configurable items for this property, you can view the thinkphp/library/think/verify.class.php file, which is not mentioned here.

The Check_verify function is used to verify the correctness of the verification code. The template post user fills in the verification code to the function, and returns $RES==TRUE validation by false to verify the failure.
Foreground template Page Build index.html

1 Class= "" >2forclass= "T" > Captcha:</label> <input id= "J_verify"3  Class= "Form-control x164 in" >4 5 class= "M" >6 </div>

Use the thinkphp U method to form a picture that generates a verification code.

The verification code is displayed as normal. Click Refresh Verification Code

From the above to generate a link to the verification code, we can see that the domain name/public/verify can generate a verification code. thinkphp Verification Code Generation mechanism is, if we need to generate a new verification code, after the link to add a variable value.

We can consider the form URL that implements the value of the public/verify/variable.

1 $ ("#verify_img"). Click (function() {2    var verifyurl = "public/ Verify "; 3    var  Time New Date (). getTime (); 4    $ ("#verify_img"). attr ({5time       6    }); 7 });

Use JS to get the current timestamp after adding to the URL.

Here we can realize the click Refresh function of verification code. concrete manifestation of the form, self-free ha.

Asynchronous checksum verification Code

We must have seen some Web sites, when we enter the verification code, the input process after the text box has been displayed error, until we enter the fight will first prompt the correct form of the code. The following code can be implemented:

1$ ("#j_verify"). KeyUp (function() {2$.post ("Public/check_verify", {3Code: $ ("#j_verify").Val ()4},function(data) {5         if(Data = =true) {6             //verification code entered correctly7}Else {8             //Verification Code input error9         }Ten     }); One});

Use Onekeyup. The principle does not need to speak more!

So that we can implement the user name password before submitting a verification code check, after the form is submitted and then check again, improve the user experience!

It's not over yet:

When we take the above form to achieve the verification code two check, the first time the asynchronous verification will be successful, but the submission of the form is prompted to verify the wrong code! In fact, the reason is still on the thinkphp Verify.class.php:

The following is the initial config configuration for this class:

protected $config=Array(        ' Sekey ' = ' thinkphp.cn ',//Verification Code Encryption key' CodeSet ' = ' 2345678abcdefhijkmnpqrstuvwxyzABCDEFGHJKLMNPQRTUVWXY ',//Verification Code Character Set' Expire ' = 1800,//Verification Code Expiration Time (s)' Usezh ' =false,//use Chinese verification Code' Zhset ' = '... This is not pasted here, too much! ‘,//Chinese Verification Code string' USEIMGBG ' =false,//use a background image' FontSize ' = 25,//captcha font size (px)' Usecurve ' =false,//whether to draw confusion curve' Usenoise ' =false,//whether to add a miscellaneous point' Imageh ' = 0,//Verification Code Picture height' Imagew ' = 0,//Verification Code Picture width' Length ' = 5,//Verify number of code bits' Fontttf ' = ',//captcha font, not set random get' BG ' =Array(243, 251, 254),//Background Color' Reset ' =true,//whether to reset after verifying success);

Please note that the last property, reset, indicates whether the verification code is reset after successful validation. I believe we all understand, we do the first check pass, in fact, the verification code has been invalidated, but because we are taking an asynchronous check, the page is not refreshed, resulting in the second application of the check and the system has been generated is not the same. So if you like the two-check style, consider configuring reset to False.

OK, the verification code problem based on Thinkphp3.2.3 is summed up here today. Just about to say a bit about the implementation method, the specific content also please refer to the official TP manual . If there is any mistake, you are welcome to point out.

ThinkPHP3.2.3 Verification code display, refresh, check