django-simple-captcha 验证码插件介绍 django-simple-captcha 使用 以及添加动态ajax刷新验证
django-simple-captcha作为一款django的验证码插件，使用方法非常简单，能够快速应用到web应用中。
文档官网地址：django-simple-captcha
参考博客：http://blog.csdn.net/tanzuozhev/article/details/50458688?locationNum=2&fps=1
参考博客：http://blog.csdn.net/shanliangliuxing/article/details/9214181
django-simple-captcha是django的验证码包，非常简单实用，这次记录的是如何点击验证码后刷新验证码，因为这个功能官方文档并没有详细给出。
django-simple-captcha官方文档：http://django-simple-captcha.readthedocs.io/en/latest/
django-simple-captcha的github网址：https://github.com/mbi/django-simple-captcha
1.安装 pip install django-simple-captcha， pip install Pillow
2.将captcha 加入 settings.py 的 INSTALLED_APPS
3.运行 python manager.py migrations 和 python manage.py migrate，以前的版本需要用到 python manage.py syncdb
4.url路由加入urls.py的urlpatterns
urlpatterns = [
url(r'^captcha/', include('captcha.urls')), # 这是生成验证码的图片
url('^some_view/', finder.views.some_view), # finder是我的app名字，需要在文件头部加入 import finder.views
]
5.在forms.py中加入
from django import forms
from captcha.fields import CaptchaFieldclass
class CaptchaTestForm(forms.Form):
title = forms.CharField(max_length=100, label='title')
price = forms.FloatField(max_value=100, label='price') # 这里是我们需要的字段，以title和price为例
captcha = CaptchaField() # 为生成的验证码图片，以及输入框
6.在views.py中加入以下代码
def some_view(request):
if request.POST:
form = CaptchaTestForm(request.POST)
# Validate the form: the captcha field will automatically
# check the input
if form.is_valid():
human = True
return HttpResponse(form.cleaned_data) # 这里没有建立模型，如果成功则直接打印
else:
return HttpResponse('validate error')
else:
form = CaptchaTestForm()
return render_to_response('template.html',locals()) # Python 的内建函数 locals() 。它返回的字典对所有局部变量的名称与值进行映射
7.template.html 的内容
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Document</title>
</head>
<body>
<form action="." method="POST">
{% csrf_token %} {{ form }}
<input type="submit" value="submit" />
</form>
</body>
</html>
8.到此打开 http://localhost:8000/some_view/ 就有有一个含有验证码的title，price的表单
这里我们简单说一下验证码生成的原理，django-simple-captcha并没有使用session对验证码进行存储，而是使用了数据库，首先生成一个表 captcha_captchastore ，包含以下字段
challenge = models.CharField(blank=False, max_length=32) # 验证码大写或者数学计算比如 1+1
response = models.CharField(blank=False, max_length=32) # 需要输入的验证码 验证码小写或数学计算的结果 比如 2
hashkey = models.CharField(blank=False, max_length=40, unique=True) # hash值
expiration = models.DateTimeField(blank=False) # 到期时间
9.打开http://localhost:8000/some_view/ 会发现有一个隐藏字段
这个隐藏字段就是hashkey的值，django将hashkey传给页面以hidden的形式存在，提交表单时 hashkey与 输入的验证码 一起post到服务器，此时服务器验证 captcha_captchastore表中 hashkey 对应的 response 是否与 输入的验证码一致，如果一致则正确，不一致返回错误。
10.django-simple-captcha ajax动态验证
了解了验证码生成的原理，我们能就可以用ajax进行动态验证
将以下代码写入 views.py:
from django.http import JsonResponse
from captcha.models import CaptchaStore def ajax_val(request):
if request.is_ajax():
cs = CaptchaStore.objects.filter(response=request.GET['response'], hashkey=request.GET['hashkey'])
if cs:
json_data={'status':1}
else:
json_data = {'status':0}
return JsonResponse(json_data)
else:
# raise Http404
json_data = {'status':0}
return JsonResponse(json_data)
11.写入 urls.py, 为上面的view设置路由
urlpatterns = [
url(r'^captcha/', include('captcha.urls')) # 这是生成验证码的图片
url('^some_view/', finder.views.some_view), # finder是我的app名字，需要在文件头部加入 import finder.views
url('^ajax_val/', finder.views.ajax_val, name='ajax_val'), # 新加入
]
12.tempalte.html 写入ajax
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Document</title>
</head>
<body>
<form action="." method="POST">
{% csrf_token %} {{ form }}
<input type="submit" value="submit" />
</form>
<script>
$(function(){
$('#id_captcha_1').blur(function(){
// #id_captcha_1为输入框的id，当该输入框失去焦点是触发函数
json_data={
'response':$('#id_captcha_1').val(), // 获取输入框和隐藏字段id_captcha_0的数值
'hashkey':$('#id_captcha_0').val()
}
$.getJSON('/ajax_val', json_data, function(data){
//ajax发送
$('#captcha_status').remove()
if(data['status']){ //status返回1为验证码正确， status返回0为验证码错误， 在输入框的后面写入提示信息
$('#id_captcha_1').after('<span id="captcha_status" >*验证码正确</span>')
}else{
$('#id_captcha_1').after('<span id="captcha_status" >*验证码错误</span>')
}
});
});
})
</script>
<script src="./jquery.js"></script> 记得导入jquery.js
</body>
</html>
至此我们完成了django-simple-captcha 的ajax动态验证
13.django-simple-captcha ajax刷新
如果当前验证码看不清，我们可以刷新一下，这个我们用ajax来做。 jango-simple-captcha本身提供了一个刷新页面，/refresh 在captcha/urls.py中：
url(r’refresh/$’, views.captcha_refresh, name=’captcha-refresh’)
这里在我们自己的urls.py中可以不做处理，直接使用 /captcha/refresh/
14.views.captcha_refresh 源码
# 只是源码介绍不用写入自己的代码中
def captcha_refresh(request):
""" Return json with new captcha for ajax refresh request """
if not request.is_ajax():
# 只接受ajax提交
raise Http404
new_key = CaptchaStore.generate_key()
to_json_response = {
'key': new_key,
'image_url': captcha_image_url(new_key),
}
return HttpResponse(json.dumps(to_json_response), content_type='application/json')
15.通过阅读源代码我们发现， views.captcha_refresh 只接受ajax提交，最后返回 key 和 image_url 的json数据，这里的key就是 hashkey， 需要我们写入id为id_captcha_1的隐藏字段， image_url为验证码图片的新url，这里我们加入ajax刷新，点击验证码图片即可实现刷新，最新的tempalte.html 代码为
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Document</title>
</head>
<body>
<form action="." method="POST">
{% csrf_token %} {{ form }}
<input type="submit" value="submit" />
</form>
<script>
$(function(){
$('.captcha').css({
'cursor': 'pointer'
})
# ajax 刷新
$('.captcha').click(function(){
console.log('click');
$.getJSON("/captcha/refresh/",
function(result){
$('.captcha').attr('src', result['image_url']);
$('#id_captcha_0').val(result['key'])
});});
# ajax动态验证
$('#id_captcha_1').blur(function(){
// #id_captcha_1为输入框的id，当该输入框失去焦点是触发函数
json_data={
'response':$('#id_captcha_1').val(), // 获取输入框和隐藏字段id_captcha_0的数值
'hashkey':$('#id_captcha_0').val()
}
$.getJSON('/ajax_val', json_data, function(data){ //ajax发送 $('#captcha_status').remove()
if(data['status']){ //status返回1为验证码正确， status返回0为验证码错误， 在输入框的后面写入提示信息
$('#id_captcha_1').after('<span id="captcha_status" >*验证码正确</span>')
}else{
$('#id_captcha_1').after('<span id="captcha_status" >*验证码错误</span>')
}
});
});
})
</script>
<script src="./jquery.js"></script> 记得导入jquery.js
</body>
</html>
ok, 现在我们已经完成了对django-simple-captcha 的使用，自己学习的心得，希望能帮到更多的小伙伴。
作者：WangC.W
出处: https://www.cnblogs.com/wangchaowei/p/6748447.html
django-simple-captcha 验证码插件介绍 django-simple-captcha 使用 以及添加动态ajax刷新验证的更多相关文章
- Django框架10 /sweetalert插件、django事务和锁、中间件、django请求生命周期
Django框架10 /sweetalert插件.django事务和锁.中间件.django请求生命周期 目录 Django框架10 /sweetalert插件.django事务和锁.中间件.djan ...
- Django学习系列之captcha 验证码插件
安装部署 安装captcha pip3. install django-simple-captcha== settings.py中引入captcha INSTALLED_APPS = [ 'djang ...
- python web框架 Django的APP以及目录介绍 django 1.11版本
如果有很多业务请求函数 应该放在app目录 很多业务放在主站上 当用户一点跳到分站 例如 一个项目叫运维平台 他的业务 有资产管理 私有云 监控 不同业务线 chouti项目 - chouti - ...
- 获取验证码随机字符串@return string $captcha，随机验证码文字
<?php//验证码工具类class Captcha{//属性private $width;private $height;private $fontsize;private $pixes;pr ...
- django入门6引入验证码插件 django-simple-captcha
Django的验证码插件 https://github.com/mbi/django-simple-captcha 安装 (mxonline) C:\Users\ws>pip install ...
- Django中Celery的实现介绍（一）
Django中Celery的实现 Celery官网http://www.celeryproject.org/ 学习资料:http://docs.jinkan.org/docs/celery/ Cele ...
- Django之Form字段插件
一.Django内置Form组件: 在使用Django内置的Form组件时,里面包含了许多[字段]和[插件],也就是验证用户输入的请求以及生成显示在前端的HTML.下面介绍一下用法: F ...
- Django中图形验证码(django-simple-captcha)
django-simple-captcha 在网站开发的登录页面中,经常会需要使用到图形验证码来验证.在Django中,django-simple-captcha库包提供了图形验证码的使用. 下面我们 ...
- Django框架使用一 基本介绍,安装和建项篇
Django概述 Django 是在快节奏的编辑环境中开发的,设计使得常见 Web 开发任务快速且容易;它可以编写一个数据驱动的Web应用程序,简单的说就是不需要开发者操作数据库. 设计数据模型 尽管 ...
随机推荐
- 我仅使用到的dd if
备份一个分区 分区 镜像名 读写块大小 dd if=/dev/sdb of=/diskone.img bs=512 注:可以为了提升I/O把bs设为较高的数值例:bs=1024k 挂载一个分区 mou ...
- opencv学习之路（8）、基本图像运算——加减与或
一.图像加法 #include<opencv2/opencv.hpp> #include<iostream> using namespace cv; using namespa ...
- Mac10.13 telnet不能用的解决方法
telnet在Mac 10.13上不能用了 Restore的方法 brew install inetutils To be clear, brew install inetutils will ins ...
- 数据库 --- 4 多表查询 ，Navicat工具 ， pymysql模块
一.多表查询 1.笛卡儿积 查询 2.连接 语法: ①inner 显示可构成连接的数据 mysql> select employee.id,employee.name,department ...
- SVM学习笔记5-SMO
首先拿出最后要求解的问题:$\underset{\alpha}{min}W(\alpha)=\frac{1}{2} \sum_{i,j=1}^{n}y^{(i)}y^{(j)}\alpha_{i}\a ...
- Spring 学习——Resources接口
Resources 针对资源文件的统一接口 Resources UrlResource:URL对应的资源,只需要一个url即可构建 ClassPathResource:获取类路径下的资源文件 File ...
- A>B等CSS选择器
这些是CSS3特有的选择器,A>B 表示选择A元素的所有子B元素.与A B的区别在于,A B选择所有后代元素,而A>B只选择一代.另外:没有<的用法. A+B表示HTML中紧随A的B ...
- 如何 使用vim的 session和viminfo 恢复上一次工作的环境??
使用vim的 session和viminfo 恢复上一次工作的环境, 主要有两个方面的内容需要保存: 要使用session,保存窗口和视图, 及全局设置 要使用viminfo保存 命令行历史, 搜索历 ...
- 【Runtime Error】打开Matlib7.0运行程序报错的解决办法
1.在C盘建立一个文件夹temp,存放临时文件: 2.右键我的电脑-属性-高级系统设置-环境变量-系统变量,将TEMP.TMP的值改成C:\temp: 3.还是在第2步那里,新建变量,变量名称为BLA ...
- P3833 [SHOI2012]魔法树
思路 树剖板子 注意给出点的编号是从零开始的 代码 #include <cstdio> #include <algorithm> #include <cstring> ...