8.1.安装captcha

直接安装:pip install django-simple-captcha

Django自动帮我们安装了相关的依赖库sixolefilePillow,其中的Pillow是大名鼎鼎的绘图模块。

注册captcha

在settings中,将‘captcha’注册到app列表里:

INSTALLED_APPS = [

'django.contrib.admin',

'django.contrib.auth',

'django.contrib.contenttypes',

'django.contrib.sessions',

'django.contrib.messages',

'django.contrib.staticfiles',

'login',

'captcha',

]

captcha需要在数据库中建立自己的数据表,所以需要执行migrate命令生成数据表:

python manage.py migrate

8.2.添加url路由

根目录下的urls.py文件中增加captcha对应的网址:

  1.  
    from django.conf.urls import url
  2.  
    from django.conf.urls import include
  3.  
    from django.contrib import admin
  4.  
    from login import views
  5.  
     
  6.  
    urlpatterns = [
  7.  
    url(r'^admin/', admin.site.urls),
  8.  
    url(r'^index/', views.index),
  9.  
    url(r'^login/', views.login),
  10.  
    url(r'^register/', views.register),
  11.  
    url(r'^logout/', views.logout),
  12.  
    url(r'^captcha', include('captcha.urls')) # 增加这一行
  13.  
    ]

8.3.修改forms.py

如果上面都OK了,就可以直接在我们的forms.py文件中添加CaptchaField了。

  1. from django import forms
  2. from captcha.fields import CaptchaField
  3.  
  4. class UserForm(forms.Form):
    1.   username = forms.CharField(label="用户名", max_length=128, widget=forms.TextInput(attrs={'class': 'form-control'}))
    2.   password = forms.CharField(label="密码", max_length=256, widget=forms.PasswordInput(attrs={'class': 'form-control'}))
    3.   captcha = CaptchaField(label='验证码')

需要提前导入from captcha.fields import CaptchaField,然后就像写普通的form字段一样添加一个captcha字段就可以了!

8.4.修改login.html

由于我们前面是手动生成的form表单,所以还要修改一下,添加captcha的相关内容,如下所示:

  1. <form class='form-login' action="/login/" method="post">
  2. <h2 class="text-center">欢迎登录</h2>
  3. <div class="form-group">
  4. {{ login_form.username.label_tag }}
  5. {{ login_form.username}}
  6. </div>
  7. <div class="form-group">
  8. {{ login_form.password.label_tag }}
  9. {{ login_form.password }}
  10. </div>
  11. <div class="form-group"> 
  12. {{ login_form.captcha.errors }}
  13. {{ login_form.captcha.label_tag }}
  14. {{ login_form.captcha }} 
  15. </div>
  16. <button type="reset" class="btn btn-default pull-left">重置</button> 
  17. <button type="submit" class="btn btn-primary pull-right">提交</button>
  18. </form>
  19. </div> 
  20. </div> <!-- /container --> 
  21. {% endblock %}

这里额外增加了一条{{ login_form.captcha.errors }}用于明确指示用户,你的验证码不正确

对于刷新验证码

修改login.html:

<div class="form-group">
{{login_form.captcha.label_tag}}<a id="refesh">刷新</a>
<p>
{{login_form.captcha}}
{{login_form.captcha.errors}}</p> </div> JS:
  //验证码动态刷新实现
$('#refesh').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/")
}

最新文章

  1. 1Z0-053 争议题目解析685
  2. Java 多字段排序Comparator(兼容Date,Integer,Doubel,Long)
  3. Java实现一致性Hash算法深入研究
  4. Entify Framewrok - 学习链接
  5. linux环境c++开发:ubuntu12.04使用llvm3.4.2
  6. python 之日期时间处理
  7. 剑指offer 二叉搜索树与双向链表
  8. 数据库DQL操作(重点)
  9. UIView的属性
  10. Linux下网络配置与修改Centos7为列
  11. 4月23日 MySQL学习-DDL
  12. unittest中的测试固件
  13. Linux中python3,django,redis以及mariab的安装
  14. hibernate 保存的flush怎么用?
  15. MySQL的一些基本命令笔记(2)
  16. 机器学习入门-数值特征-数据四分位特征 1.quantile(用于求给定分数位的数值) 2.plt.axvline(用于画出竖线) 3.pd.pcut(对特征进行分位数切分,生成新的特征)
  17. CentOS7上Python3.5安装
  18. Round() 四舍五入 js银行家算法
  19. 设计模式之原型模式(深入理解OC中的NSCopying协议以及浅拷贝、深拷贝)
  20. 初始JAVA中浅拷贝和深拷贝

热门文章

  1. js 延迟函数
  2. Amazon MWS Scratchpad
  3. 在网页中嵌入Base64编码文件
  4. shell脚本通过子网掩码计算出掩码位数
  5. 最新 苏州朗动java校招面经 (含整理过的面试题大全)
  6. SELinux安全子系统的学习
  7. lombok的@Accessors注解
  8. redis的key设置每天凌晨过期的思路
  9. centos 用户组操作
  10. [转帖]Dockerfile: ENTRYPOINT和CMD的区别