yuanlj-tea/slide-captcha

滑动验证码

Installs: 105

Dependents: 1

Suggesters: 0

Security: 0

Stars: 3

Watchers: 0

Forks: 73

Language:JavaScript

v1.0.3 2021-11-29 11:07 UTC

This package is auto-updated.

Last update: 2022-08-29 02:52:10 UTC


README

68747470733a2f2f747661312e73696e61696d672e636e2f6c617267652f30303753385a496c67793167686d337a716e6b66686a333065363065366a78622e6a7067

Installation

Use composer:

composer require yuanlj-tea/slide-captcha

Usage

You can create a slide captcha with make func:

use Tncode\SlideCaptcha;

$captcha = new SlideCaptcha();
$captcha->make();

Set logo path

$captcha->setLogoPath(__DIR__.'/logo/logo.png');

You can output captcha directly:

use Tncode\SlideCaptcha;

$captcha = new SlideCaptcha();
$captcha->build();
$captcha->imgout(0,1);

Or inline it directly in the HTML page:

use Tncode\SlideCaptcha;

$captcha = new SlideCaptcha();
$captcha->build();
$linlie = $captcha->getInline();
echo "<img src='".$linlie."' />";

You'll be able to get the code and compare it with a user input :

use Tncode\SlideCaptcha;

$captcha = new SlideCaptcha();
$captcha->build();
$captcha->getCode();

Used in Laravel

Register ServiceProvider and Facade with config/app.php:

'providers' => [
    // ...
    \Tncode\SlideCaptchaServiceProvider::class,
],
'aliases' => [
    // ...
    'SlideCode' => \Tncode\SlideCaptchaFacade::class,
],

Get a service instance:

Method parameter injection:

use Tncode\SlideCaptcha;

public function getImage(Request $request, SlideCaptcha $captcha)
{
  
}

Obtained by the facade class:

use SlideCode;

public function getImageV1()
{
     SlideCode::build();
     $imgData = SlideCode::getInline();
     $code = SlideCode::getCode();
}

By service name:

public function getImageV2()
{
     $captcha = app('slide_captcha');
     $captcha->build();

     $imgData = $captcha->getInline();
     $code = $captcha->getCode();
}

Check demo:

public function getCaptchaDemo(Request $request, SlideCaptcha $captcha)
    {
        $key = 'slide-captcha-' . \Str::random(32);

        $captcha->build();

        \Cache::put($key, ['code' => $captcha->getCode()], 600);

        $result = [
            'captcha_key' => $key,
            'expired_at' => time() + 600,
            'captcha_image_content' => $captcha->getInline()
        ];
        return $this->responseData($result);
    }

    public function checkDemo(Request $request)
    {
        $key = $request->get('captcha_key', '');
        $code = $request->get('captcha_code', '');

        if (!\Cache::has($key)) {
            return $this->responseData('无效的key', 400);
        }

        $ret = abs(\Cache::get($key)['code'] - $code) <= 3;
        if ($ret) {
            return $this->responseData('验证成功');
        } else {
            $errKey = $key . '_error';
            $errCount = $request->session()->has($errKey) ? $request->session()->get($errKey) : 1;
            $request->session()->put($errKey, $errCount + 1);

            if ($errCount > 8) {
                \Cache::forget($key);
                $request->session()->forget($errKey);
                return $this->responseData('失败次数过多,请重新获取验证码', 400);
            }
            return $this->responseData('验证失败', 400);
        }
    }

Web demo:

see /path/vendor/yuanlj-tea/slide-captcha/src/index.html

License

MIT