圖片驗證碼 Captcha

毛仔發表於2018-11-21
APT

1.拉取元件

composer require gregwar/captcha

use Gregwar\Captcha\CaptchaBuilder; 
use Gregwar\Captcha\PhraseBuilder;

2.使用例項

    public static function captcha($key = null)
    {
    $key = $key ?? CAPTCHA_IMG;
    $phrase = new PhraseBuilder;
    // 設定驗證碼位數
    $code = $phrase->build(4);
    // 生成驗證碼圖片的Builder物件,配置相應屬性
    $builder = new CaptchaBuilder($code, $phrase);
    // 設定背景顏色
    $builder->setBackgroundColor(220, 210, 230);
    $builder->setMaxAngle(25);
    $builder->setMaxBehindLines(10);
    $builder->setMaxFrontLines(10);
    // 可以設定圖片寬高及字型
    $builder->build($width = 100, $height = 40, $font = null);
    // 獲取驗證碼的內容
    $phrase = $builder->getPhrase();
    // 把內容存入session
    \Log::info($key.'-'.$phrase);
    //        Session::flash($key, $phrase);
    session()->put($key, $phrase);

    $session_val = Session::get($key);
    \Log::info('common中'.$key.'在session中值為'.$session_val);
    // 生成圖片
    header('Cache-Control: no-cache, must-revalidate');
    header('Content-Type:image/jpeg');
    $builder->output();
    }

3.路由

Route::get('/getCaptcha/{mun}/{page}', 'RegisterController@getCaptcha');

4.js

<script>
$('#register-form').find('.captcha-img').click(function () {
$(this).attr('src', routeHome + '/getCaptcha' + '/' + Math.random() + '/register');
});
</script>

5.前臺

<img class="captcha-img" src="{{url('/getCaptcha/1/register')}}" alt="">

兩個點需要解釋一下，中間的隨機數是因為，瀏覽器右快取機制，對於同一url的資源，瀏覽器會減少請求次數，加一個隨機數區別路由。另外驗證碼存取的時候我用的是session::put()和session::pull();為什麼不用session::flash()和session::get()呢，因為專案中，session::flash（）出現了高頻率存入資訊失敗的現象，session::pull()是取出並刪除，所以能達到同樣的效果，並且尚未出現問題。

本作品採用《CC 協議》，轉載必須註明作者和本文連結

相關文章