Captcha form Jike API, It's very simple but it's light weight and very fast. No need generate captcha image locally, so you need not install any software for it, such as ImageMagick. It get captcha form a fast and stable service clusters. It's good choice for Captcha, try it!
Add this line to your application's Gemfile:
gem 'jike_captcha'
And then execute:
$ bundle
Or install it yourself as:
$ gem install jike_captcha
Before use it, you need get you app_key form Jike API site.
Once get your app_key, you need tell JikeCaptcha what kind of app_key you got, there are two ways:
One: create a file in config/initializers/jike_captcha.rb with below code:
# config/initializers/jike_captcha.rb
Jike::Captcha.app_key = "<your_app_key>"
Two: set app_key in config/application.rb:
config.jike_app_key = '<your_app_key>'
<%= form_for :post do |f| %>
<%= captcha_tag %>
<%= f.submit %>
<% end %>
The most useful helper is captcha_tag
, it will render all the necessary tags.
args:
:wrapper_html
: options for wrapper tag:tag
: control wrapper tag type
:input_html
: options for captcha text filed tag:image_html
: options for captcha img tag:src_type
: control image url type. if set to:data_url
, will render img src as base64 encode:update
: if set to true, captcha can be update be ajax, if set to a hash, value for:text
key in that has will used for update link content.
All the options at below are default value, except args[:image_html][:src_type]
, its default value is nil.
captcha_tag wrapper_html: {
tag: :div,
id: 'jike_captcha_wrapper',
class: 'jike_captcha_wrapper'
},
input_html: {
id: 'jike_captcha_input',
class: 'jike_captcha_input',
name: 'jike_captcha_value'
},
image_html: {
src_type: :data_url,
update: { text: 'change a new one' },
id: 'jike_captcha_image',
class: 'jike_captcha_image'
}
render:
<div class="jike_captcha_wrapper" id="jike_captcha_wrapper">
<input class="jike_captcha_input" id="jike_captcha_input" name="jike_captcha_value" type="text" />
<img class="jike_captcha_image" data-src-type="data_url" id="jike_captcha_image" src="data:image/png;base64,iVBO......" style="cursor: pointer;" />
<input class="jike_captcha_id" id="jike_captcha_id" name="jike_captcha_id" type="hidden" value="..." />
<a href="javascript: void(0);" id="jike_captcha_update_link">change a new one</a>
<script type="text/javascript">
//<![CDATA[
$(function(){
$('body').on('click', 'img#jike_captcha_image, a#jike_captcha_update_link', function(event) {
var imageType, $captchaInput, $captchaImage, $captchaId;
$captchaInput = $('input#jike_captcha_input');
$captchaImage = $('img#jike_captcha_image');
$captchaId = $('input#jike_captcha_id');
imageType = $captchaImage.data('src-type');
$.getJSON('/jike_captcha/get_captcha.json', {image_type: imageType}, function(data) {
$captchaInput.val('');
$captchaImage.attr('src', decodeURIComponent(data.captcha_image));
$captchaId.val(data.captcha_id);
});
});
});
//]]>
</script>
</div>
Submit captcha value form your form, then you can validate it in your controller use captcha_valid?
method. It's very simple to do that.
class UsersController < ApplicationController
def create
if captcha_valid? # Same as Jike::Captcha::Validation.captcha_valid?(params)
User.create(params[:user])
else
redirect_to :new, notice: 'Captcha is not correct!'
end
end
end
As default, captcha value should submited by params[:jike_captcha_value]
, another value is params[:jike_captcha_id]
, it's generate by captcha_tag
helper automatically.
Custom captcha value param in your form
You can use any param key to submit captcha value, as below:
<%= captcha_tag input_html: { name: 'my_captcha_value' } %>
The captcha value will submited by params[:my_captcha_value]
. But you can't custom another value params[:jike_captcha_id]
.
then validate in your controller like this:
class UsersController < ApplicationController
def create
if captcha_validate(params[:my_captcha_value])
User.create(params[:user])
else
redirect_to :new, notice: 'Captcha is not correct!'
end
end
end
- Fork it
- Create your feature branch (
git checkout -b my-new-feature
) - Commit your changes (
git commit -am 'Add some feature'
) - Push to the branch (
git push origin my-new-feature
) - Create new Pull Request