thinkphp6验证码使用前后端分离模式，api接口验证

多应用路由配置  route/app.php

Route::get('captcha/:id', "\\think\\captcha\\CaptchaController@index");

跨域请求需要在路由结尾加一个

->allowCrossDomain

Route::get('captcha/:id', "\\think\\captcha\\CaptchaController@index")->allowCrossDomain;

修改验证码扩展代码，session改为chche

vendor/topthink/think-captcha/src/Captcha.php （找到创建验证码（generate）的方法

更改如下

    /**
     * 创建验证码
     * @return array
     * @throws Exception
     */
    protected function generate(): array
    {
        $bag = '';

        if ($this->math) {
            $this->useZh  = false;
            $this->length = 5;

            $x   = random_int(10, 30);
            $y   = random_int(1, 9);
            $bag = "{$x} + {$y} = ";
            $key = $x + $y;
            $key .= '';
        } else {
            if ($this->useZh) {
                $characters = preg_split('/(?<!^)(?!$)/u', $this->zhSet);
            } else {
                $characters = str_split($this->codeSet);
            }

            for ($i = 0; $i < $this->length; $i++) {
                $bag .= $characters[rand(0, count($characters) - 1)];
            }

            $key = mb_strtolower($bag, 'UTF-8');
        }

        $hash = password_hash($key, PASSWORD_BCRYPT, ['cost' => 10]);

        // $this->session->set('captcha', [
        //     'key' => $hash,
        // ]);

        cache('captcha', [
            'key' => $hash,
        ]);

        return [
            'value' => $bag,
            'key'   => $hash,
        ];
    }

vendor/topthink/think-captcha/src/Captcha.php （找到验证 验证码（check）的方法

    /**
     * 验证验证码是否正确
     * @access public
     * @param string $code 用户验证码
     * @return bool 用户验证码是否正确
     */
    public function check(string $code): bool
    {
        // if (!$this->session->has('captcha')) {
        //     return false;
        // }
        if (!cache('captcha')) {
            return false;
        }

        // $key = $this->session->get('captcha.key');
        $key = cache('captcha')['key'];

        $code = mb_strtolower($code, 'UTF-8');

        $res = password_verify($code, $key);

        if ($res) {
            // $this->session->delete('captcha');
           
            cache('captcha');
        }

        return $res;
    }

定义接口方法

    //生成验证码
    public function verify(){

        //验证码标识
        $id=mt_rand(100000, 999999);
        $uniqid = uniqid("$id");
        //返回数据 验证码图片路径、验证码标识
        $data = [
            'src' =>"http://tp6" . captcha_src($uniqid),
            'uniqid' => $uniqid
        ];
        return json($data);
    }

后端接收验证码，调用验证

use think\captcha\facade\Captcha;
class Login extends BaseController{
    public function login(){
        $pt = input("post.");
        $captcha = new Captcha();
        if($captcha::check($pt['code'])){
            //验证码正确
        }else{
            $this->info['code'] = 201;
            $this->info['msg'] = '验证码有误'.$pt['code'];
            return json($this->info);
        }
    }
}

上一篇：vue项目使用canvas创建文字水印

下一篇：解决一个页面中，组件多次调用触发回调，回调函数中加入索引