README

比传统基于文本的验证码更直观、更简洁的替代品

这是基于 jQuery 的 Laravel 版本的 Captcha 替代方案，源自 http://visualcaptcha.net。VisualCaptcha 是使用图像而不是文本（并且对移动友好）实现的，最易于实施的、最安全的 Captcha。

比基于文本的验证码更好的替代品。
减少用户沮丧情绪，提高转化率。
服务器端验证。
易于样式化和添加自定义图片。
易于翻译文本。
可用于视图和控制层。

先决条件

Laravel
PHP 5.3

后端安装

首先通过 Composer 安装此软件包。

{
    "require": {
		"hugocabral/visualcaptcha-laravel-jquery": "~1.0"
	}
}

将这些行添加到配置文件夹中 "app.php" 文件中 "aliases" 类别顶部

	// app.php
	'Captcha'          => 'visualCaptcha\Captcha',
	'SessionCaptcha'   => 'visualCaptcha\SessionCaptcha',

在终端更新 composer

	composer update

注意

示例/文件夹包含用于此处所示 Laravel 示例的 app/ 和 public/ 文件： http://www.hugocabral.pt/visualCaptcha-Laravel-jQuery

用法

注意：此实现使用 Laravel 的本地化（语言）。无需惊慌，它很容易使用，你可以在本 README 的本地化部分找到解释。

添加路由

// routes.php

		// Check Locale selected and show demo view. If your app will be English only, you can remove: $lang = Config::get('app.locale'); and remove: ,compact('lang').
		Route::get('/', array('as' => 'demo', function()
		{
		    $lang = Config::get('app.locale');
		    return View::make('demo', compact('lang'));
		}));
		
		// Send method to validate captcha
		Route::post('captchacheck','CaptchaController@send');
		
		// Routes for app.visualcaptcha.js. 
		Route::group(array('prefix' => 'captcha'), function()
		{
		    Route::get('start/{howmany}', array('as' => 'captcha/start', 'uses'=>'CaptchaController@start'));
		    Route::get('audio/{type?}', array('as' => 'captcha/audio', 'uses'=>'CaptchaController@audio'));
		    Route::get('image/{index?}', array('as' => 'captcha/image', 'uses'=>'CaptchaController@image'));
		});

创建 CaptchaController.php 以创建验证码、刷新、验证并执行操作（例如发送电子邮件、更新数据库）

// app/controllers/CaptchaController.php

		class CaptchaController extends BaseController {
		
		    /**
		     * Generate a Captcha
		     * @return Response
		     */
		    public function start($howmany)
		    {
		        $session = new SessionCaptcha();
		        $captcha = new Captcha($session);
		        $captcha->generate($howmany);
		
		        return Response::json($captcha->getFrontEndData());
		    }
		
		    /**
		     * Get an audio file
		     * @param  string $type Song type (mp3/ogg)
		     * @return File
		     */
		    public function audio($type = 'mp3')
		    {
		        $session = new SessionCaptcha();
		        $captcha = new Captcha($session);

		        return $captcha->streamAudio(array(), $type);
		    }
		
		    /**
		     * Get an image file
		     * @param  string $index Image index
		     * @return File
		     */
		    public function image($index)
		    {
		        $session = new SessionCaptcha();
		        $captcha = new Captcha($session);

		        return $captcha->streamImage(array(), $index, 0 );
		    }
		
		    /**
		     * Check if the Captcha result is good
		     * @return Mixed
		     */
		    public function send()
		    {
		
		        $data = Input::all();
		
		        //Validation rules
		        $rules = array(
		
		            'name' => 'required'
		        );
		
		        //Validate data
		        $validator = Validator::make($data, $rules);
		
		        //If everything is correct than run passes.
		        if ($validator->passes())
		        {
		            $session = new SessionCaptcha();
		            $captcha = new Captcha($session);
		
		            $frontendData = $captcha->getFrontendData();
		
		            if (!$frontendData)
		            {
		                return Redirect::back()->withInput()->withErrors(array('message' => Lang::get('text.captcha.none')));
		    
		            } else
		            {
		                // If an image field name was submitted, try to validate it
		                if ($imageAnswer = Input::get($frontendData['imageFieldName']))
		                {
		                    if ($captcha->validateImage($imageAnswer))
		                    {
		                        // Return true if the result is correct
		
		                        (... DO ACTION HERE, ex send email, update db...)
		
		                        // This return back to form to show sucess, thats why i use status=1 
		                        return Redirect::back()->with('status', 1);
		
		                    } else
		                    {
		                        return Redirect::back()->withInput()->withErrors(array('message' => Lang::get('text.captcha.image')));
		                        
		                    }
		                } else if ($audioAnswer = Input::get($frontendData['audioFieldName']))
		                {
		                    if ($captcha->validateAudio($audioAnswer))
		                    {
		                        // Return true if the result is correct
		
		                        (... DO ACTION HERE, ex send email, update db...)
		
		                         // This return back to form to show sucess, thats why i use status=1 
		                        return Redirect::back()->with('status', 1);
		
		                    } else
		                    {
		                        return Redirect::back()->withInput()->withErrors(array('message' => Lang::get('text.captcha.audio')));
		                        
		                    }
		                } else
		                {
		                    return Redirect::back()->withInput()->withErrors(array('message' => Lang::get('text.captcha.incomplete')));
		                    
		                }
		            }
		
		        } else
		        {
		            //return "contact form with errors";
		            return Redirect::back()->withErrors($validator)->with('status', 2);;
		
		        }
		
		    }
		}

注意：Lang::get('xxx.xxx.xxx') 代码是本地化（语言）的实现。如果你的应用程序只使用英语，你可以直接使用并替换这些消息/错误。

在您的视图或主布局或您将使用 visualCaptcha 的任何位置包含 jQuery 库、jQuery visualCaptcha 前端库和 app.js

// contact.blade.php
{{ HTML::script(js/jquery.min.js) }}
{{ HTML::script(js/visualcaptcha.jquery.js) }}
{{ HTML::script(js/app.js') }}) }}

hugocabral / visualcaptcha-laravel-jquery

维护者

详细信息