django-simple-captcha是django的验证码插件，非常简单实用，本文讲了django验证码插件captcha的应用以及实现点击验证 动码后动态刷新验证码。
实验环境：
python2.7
1、安装captcha
pip install django-simple-captcha2、settings.py文件中引入captcha
INSTALLED_APPS = ['django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
'captcha',
]
# django_simple_captcha 验证码配置
# 格式
CAPTCHA_OUTPUT_FORMAT = u'%(text_field)s %(hidden_field)s %(image)s'
# 噪点样式
CAPTCHA_NOISE_FUNCTIONS = (
# 'captcha.helpers.noise_null', # 没有样式
# 'captcha.helpers.noise_arcs', # 线
'captcha.helpers.noise_dots', # 点
)
# 图片大小
CAPTCHA_IMAGE_SIZE = (80, 25)
CAPTCHA_BACKGROUND_COLOR = '#ffffff'
# CAPTCHA_CHALLENGE_FUNCT = 'captcha.helpers.random_char_challenge' # 图片中的文字为随机英文字母，如 mdsh
CAPTCHA_LENGTH = 4 # 字符个数
CAPTCHA_TIMEOUT = 1 # 超时(minutes)
CAPTCHA_CHALLENGE_FUNCT = 'captcha.helpers.math_challenge' # 图片中的文字为数字表达式，如1+2=</span>
3、url.py配置
from django.conf.urls import url, includefrom django.contrib import admin
urlpatterns = [
url(r'^captcha/', include('captcha.urls')), #生成验证码图片功能
]
4、数据库同步
makemigrationsmigrate
5、定义forms.py
from django import formsfrom captcha.fields import CaptchaField
class CaptchaTestForm(forms.Form):
captcha = CaptchaField() # 验证码
6、views.py配置
from django.shortcuts import render,HttpResponse,HttpResponseRedirect,render_to_responsefrom django.contrib.auth import authenticate,login,logout
from forms import CaptchaTestForm
@csrf_exempt
def acc_login(request): #登陆验证
if request.method == 'POST':
form = CaptchaTestForm(request.POST)
username = request.POST.get('username')
passwd = request.POST.get('password')
user = authenticate(username=username,password=passwd)
if user is not None and form.is_valid():
human = True
login(request,user)
return HttpResponseRedirect('/')
else:
return render(request, "login.html", {"status": "error"})
else:
form = CaptchaTestForm()
return render_to_response('login.html', locals())
7、html文件
<body background="/statics/imgs/timg1.jfif" style="background-repeat: no-repeat;background-size: 100% 100%;background-attachment: fixed"><br>
<br>
<div class="container" style="background-color:rgba(255,255,255,0.2);width: 30%;">
<form method="post" style="margin-left: 30%">{% csrf_token %}
<br>
<br>
<h2>XXXX查询系统</h2>
<br>
<div class="form-group">
<input type="text" name="username" class="form-control" placeholder="Username" style="width: 6.3cm"/>
<br>
<input type="password" name="password" class="form-control" placeholder="Password" style="width: 6.3cm"/>
<br>
{{ form.captcha }}
</div>
<br>
<br>
<input type="submit" class="btn btn-info" value="Login" style="width: 6.3cm"/>
<br>
<br>
</form>
</div> <!-- /container -->
<script src="/statics/js/jquery.min.js"></script>
<script src="/statics/js/bootstrap.min.js"></script>
<script type="text/javascript">
//验证码动态刷新实现
$('.captcha').click(function () {
$.getJSON("/captcha/refresh/", function (result) {
$('.captcha').attr('src', result['image_url']);
$('#id_captcha_0').val(result['key'])
});
});
//后端返回验证失败后的动作
if('{{ status }}' == 'error'){
alert("验证失败，请重新登录！");
window.location.assign("/accounts/login/")
}
</script>
</body>
8、实现效果
