ThinkPHP6 project basic operation (12. Verification code for actual combat part)

TP6 has a built-in verification code plug-in, which can be used only by simple installation and configuration, and the verification of the verification code is also very convenient. Let's start the performance below.

1. Install the verification code

composer require topthink/think-captcha

Second, use in the template

Replace the verification code image of the original static page with {:captcha_img()}this one will automatically generate a verification code image.

<div style="margin-left: 10px;">
  {:captcha_img()}
</div>

The generated html code is:

<img src="/captcha.html?0.12285642498823002" alt="captcha" onclick="this.src=&quot;/captcha.html?&quot;+Math.random();">

As can be seen from the generated code, click on the picture to switch the picture. Generated image:

If the picture does not come out, check whether the path is correct and the route is correct. Direct browser access http://tp6.com/captchawill also display the QR code. If it is not displayed, consider the correctness of the routing.

Three, modify the verification code configuration

In the configcatalog New captcha.php:

<?php

return [
    'length' => 4,
    'codeSet'   =>  '0123456789',
    'useCurve' => false
];

Specific configurable items:

parameter	description	default
codeSet	Verification code character set	slightly
expire	Verification code expiration time (s)	1800
math	Use arithmetic verification code	false
useZh	Use Chinese verification code	false
zhSet	Chinese verification code string	slightly
useImgBg	Use background image	false
fontSize	Verification code font size (px)	25
useCurve	Whether to draw a confusion curve	true
useNoise	Whether to add noise	true
imageH	The height of the verification code image, set to 0 for automatic calculation	0
imageW	Verification code image width, set to 0 for automatic calculation	0
length	Verification code digits	5
fontttf	Verification code font, random access if not set	air
bg	background color	[243, 251, 254]
reset	Whether to reset after successful verification	true

Four, custom verification code

1. Create

In addition to using the default method {:captcha_img()}, you can also think\captcha\facade\Captchacreate a verification code by yourself through the class.

<?php

namespace app\admin\controller;
use think\captcha\facade\Captcha;

class Verify
{
    
    
    public function index(){
    
    
        return Captcha::create();
    }
}

The verification code can also be returned normally through this controller:

2. Configuration

Custom verification codes can also be configured. You can config/captcha.phpdefine a configuration in the file, and then pass in the configuration key when creating it
captcha.php::

<?php

return [
    'length' => 4,
    'codeSet'   =>  '0123456789',
    'useCurve' => false,
	// 配置名称可以随意取
    'my_set' => [
        'length' => 3,
        'codeSet' => 'abcdefg'
    ]
];

Modify the Verifycontroller:

return Captcha::create('my_set');

Shuichi Shita:

3. Use

<img src="{:url('verify/index')}" class="layadmin-user-login-codeimg">

If you want to click to switch the verification code, you can add an onclick event to imitate the original method.

Five, verification

Built-in verification functions of the framework:

$this->validate($data,[
    'captcha|验证码'=>'require|captcha'
]);

If you are not using the built-in verification function, you can investigate the built-in function for manual verification

if(!captcha_check($captcha)){
    
    
 // 验证失败
};

It should be noted that TP6not enabled by default Session, you need to open of its own, and here CAPTCHA need to sessionfunction, so the middleware modify files in the app directory middleware.php, will \think\middleware\SessionInit::classcomment to let go.