标签:
django中的Form一般有两种功能:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title></title> <style> .error-msg { color: red; } </style> </head> <body> <div> <div> 用户名:<input type="text" name="user" /> </div> <div> 密码:<input type="password" name="pwd" /> </div> <div> 数字 <input type="text" name="num" /> </div> <div> 手机号<input type="text" name="phone" /> </div> <div> 邮箱<input type="text" name="email" /> </div> <input type="button" value="提交" onclick="DoSubmit();" /> </div> <script src="/static/js/jquery-1.12.4.js"></script> <script> function DoSubmit(){ var input_dict = {}; $(‘input‘).each(function(){ var v = $(this).val(); var n = $(this).attr(‘name‘); input_dict[n] = v; }); $.ajax({ url: ‘/login/‘, type: ‘POST‘, data: input_dict, dataType:‘json‘, success: function (result) { if (result.status) { location.href = ‘www.baidu.com‘; } else { $.each(result.message, function (k,v) { var tag = document.createElement(‘span‘); tag.className = ‘error-msg‘; tag.innerText = v[0].message; $(‘input[name="‘ + k + ‘"]‘).siblings(‘span‘).remove(); $(‘input[name="‘ + k + ‘"]‘).after(tag); }) } } }) } </script> </body> </html>
from django import forms
import json
from django.core.exceptions import ValidationError
import re
#自定义验证规则
def mobile_validate(value):
mobile_re = re.compile(r‘^(13[0-9]|15[012356789]|17[678]|18[0-9]|14[57])[0-9]{8}$‘)
if not mobile_re.match(value):
raise ValidationError(‘手机号码格式错误‘)
#定义验证规则
class MyForm(forms.Form):
user = forms.CharField(required=True, error_messages={‘required‘: ‘用户名不能为空.‘})
pwd = forms.CharField(required=True,
min_length=6, #最少长度
max_length=10, #最大长度
error_messages={‘required‘: ‘密码不能为空.‘, ‘min_length‘: "至少6位"}, #不合法提示信息
widget=forms.PasswordInput) #输入类型
num = forms.IntegerField(error_messages={‘required‘: ‘数字不能空.‘, ‘invalid‘: ‘必须输入数字‘})
email = forms.EmailField(required=True,error_messages={‘required‘: ‘邮箱不能空.‘, ‘invalid‘: ‘邮箱格式错误‘})
#应用自定义验证规则
phone = forms.CharField(required=True,validators=[mobile_validate,],error_messages={‘required‘:‘请填写手机号‘} )
def login(request):
if request.method == ‘POST‘:
result = {‘status‘:False,‘message‘:None}
obj = MyForm(request.POST)
ret = obj.is_valid()
if ret:
msg = obj.clean()
result[‘status‘] = True
result[‘message‘] = msg
else:
msg = obj.errors.as_json() #将异常信息以json格式输出
result[‘status‘] = False
result[‘message‘] = json.loads(msg)
print(result)
return HttpResponse(json.dumps(result))
else:
return render(request,‘login.html‘)
效果:
涉及的知识点:
上面的例子是在html中直接使用form表单,然后利用ajax提交数据到后台进行验证,下面的例子使用django生成form表单里的元素,然后进行提交验证
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title></title> <style> .error-msg { color: red; } </style> </head> <body> <form> <div> <div> 用户名: {{ obj.user }} {% if obj.errors.user %} <span class="error-msg"> {{ obj.errors.user.0 }}</span> {% endif %} </div> <div> 密码:{{ obj.pwd }} {% if obj.errors.pwd %} <span class="error-msg"> {{ obj.errors.pwd.0 }}</span> {% endif %} </div> <div> 数字:{{ obj.num }} {% if obj.errors.num %} <span class="error-msg"> {{ obj.errors.num.0 }}</span> {% endif %} </div> <div> 手机号: {{ obj.phone }} {% if obj.errors.phone %} <span class="error-msg"> {{ obj.errors.phone.0 }}</span> {% endif %} </div> <div> 邮箱: {{ obj.email }} {% if obj.errors.email %} <span class="error-msg"> {{ obj.errors.email.0 }}</span> {% endif %} </div> <input type="submit" value="提交" /> </div> </form> </body> </html>
def login2(request):
if request.POST:
objPost = MyForm(request.POST)
ret = objPost.is_valid()
if ret:
print(objPost.clean())
else:
from django.forms.utils import ErrorDict
#print(type(obj.errors),obj.errors.as_json())
# obj1.errors
pass
return render(request, ‘login2.html‘,{‘obj‘: objPost})
else:
objGet = MyForm()
return render(request, ‘login2.html‘,{‘obj‘: objGet})
test_choices = (
(0, ‘上海‘),
(1, ‘背景‘),
)
test = forms.IntegerField(widget=forms.Select(choices=test_choices))
django为用户实现防止跨站请求伪造的功能,通过中间件 django.middleware.csrf.CsrfViewMiddleware 来完成。而对于django中设置防跨站请求伪造功能有分为全局和局部。
中间件 django.middleware.csrf.CsrfViewMiddleware
局部:
def csrf(request):
return render(request,‘csrf.html‘)
<form action="csrf.html" method="post"> <input type="text"> <input type="submit" value="form提交"> {% csrf_token%} //承接csrf的token </form>
打开html之后,发现,在html form表单中已经得道token
cookie中也得道了token
需加入jquery.cookie插件
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <form action="csrf.html" method="post"> <input type="text"> <input type="submit" value="form提交"> <!--{% csrf_token%}--> </form> <input type="button" value="Ajax提交" onclick="ajaxpost();"> <script src="/static/js/jquery-1.12.4.js"></script> <script src="/static/js/jquery.cookie.js"></script> <script> var csrftoken = $.cookie(‘csrftoken‘); function csrfSafeMethod(method) { return (/^(GET|HEAD|OPTIONS|TRACE)$/.test(method)); } $.ajaxSetup({ beforeSend: function (xhr,settings) { if (!csrfSafeMethod(settings.type) && (!this.crossDomain)) { xhr.setRequestHeader("X-CSRFToken",csrftoken); } } }); function ajaxpost() { $.ajax({ url:‘/csrf/‘, type:‘post‘, data:{‘k1‘:‘v1‘}, success: function (data) { console.log(data) } }); } </script> </body> </html>
标签:
原文地址:http://www.cnblogs.com/pycode/p/form-csrf.html