README

可视化和更简洁的替代传统文本Captcha

这是一个使用jQuery的Laravel版本，它替代了来自http://visualcaptcha.net的Captcha。可视Captcha是一个使用图像而不是文本（并且对移动设备友好）的易于实现的、安全的Captcha。

文本Captcha的更好替代品。
减少用户挫败感，提高转化率。
服务器端验证。
易于样式化和添加自定义图像。
易于翻译文本。
可用于视图和控制台。

先决条件

Laravel
PHP 5.3

后端安装

首先，通过Composer安装此包。

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

将以下行添加到配置文件夹中“app.php”文件的“别名”类别顶部

	// 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')代码是本地化（语言）的实现。如果您的应用程序仅使用英语，则可以硬编码并替换此消息/错误。

在您的视图或主布局或您将使用可视Captcha的任何地方包含jQuery库、jQuery可视Captcha前端库和app.js

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

rodrigojusto / visualcaptcha-laravel-jquery

维护者

详细信息