djangoform表单使用验证码
2024-08-27 06:49:38
8.1.安装captcha
直接安装:pip install django-simple-captcha
Django自动帮我们安装了相关的依赖库six
、olefile
和Pillow
,其中的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对应的网址:
- from django.conf.urls import url
- from django.conf.urls import include
- from django.contrib import admin
- from login import views
- urlpatterns = [
- url(r'^admin/', admin.site.urls),
- url(r'^index/', views.index),
- url(r'^login/', views.login),
- url(r'^register/', views.register),
- url(r'^logout/', views.logout),
- url(r'^captcha', include('captcha.urls')) # 增加这一行
- ]
8.3.修改forms.py
如果上面都OK了,就可以直接在我们的forms.py文件中添加CaptchaField了。
- from django import forms
- from captcha.fields import CaptchaField
- class UserForm(forms.Form):
- username = forms.CharField(label="用户名", max_length=128, widget=forms.TextInput(attrs={'class': 'form-control'}))
- password = forms.CharField(label="密码", max_length=256, widget=forms.PasswordInput(attrs={'class': 'form-control'}))
- captcha = CaptchaField(label='验证码')
需要提前导入from captcha.fields import CaptchaField
,然后就像写普通的form字段一样添加一个captcha字段就可以了!
8.4.修改login.html
由于我们前面是手动生成的form表单,所以还要修改一下,添加captcha的相关内容,如下所示:
- <form class='form-login' action="/login/" method="post">
- <h2 class="text-center">欢迎登录</h2>
- <div class="form-group">
- {{ login_form.username.label_tag }}
- {{ login_form.username}}
- </div>
- <div class="form-group">
- {{ login_form.password.label_tag }}
- {{ login_form.password }}
- </div>
- <div class="form-group">
- {{ login_form.captcha.errors }}
- {{ login_form.captcha.label_tag }}
- {{ login_form.captcha }}
- </div>
- <button type="reset" class="btn btn-default pull-left">重置</button>
- <button type="submit" class="btn btn-primary pull-right">提交</button>
- </form>
- </div>
- </div> <!-- /container -->
- {% 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/")
}
最新文章
- 1Z0-053 争议题目解析685
- Java 多字段排序Comparator(兼容Date,Integer,Doubel,Long)
- Java实现一致性Hash算法深入研究
- Entify Framewrok - 学习链接
- linux环境c++开发:ubuntu12.04使用llvm3.4.2
- python 之日期时间处理
- 剑指offer 二叉搜索树与双向链表
- 数据库DQL操作(重点)
- UIView的属性
- Linux下网络配置与修改Centos7为列
- 4月23日 MySQL学习-DDL
- unittest中的测试固件
- Linux中python3,django,redis以及mariab的安装
- hibernate 保存的flush怎么用?
- MySQL的一些基本命令笔记(2)
- 机器学习入门-数值特征-数据四分位特征 1.quantile(用于求给定分数位的数值) 2.plt.axvline(用于画出竖线) 3.pd.pcut(对特征进行分位数切分,生成新的特征)
- CentOS7上Python3.5安装
- Round() 四舍五入 js银行家算法
- 设计模式之原型模式(深入理解OC中的NSCopying协议以及浅拷贝、深拷贝)
- 初始JAVA中浅拷贝和深拷贝