表单验证

Django账户管理部分——登录与注册

安稳与你 提交于 2020-02-06 18:37:20
个人网站功能包括发表、存储个人文章,保存网络上的图片,展示图片,保存并展示个人视频。以下为网站的登陆注册部分。 上期文章: 个人网站开发前相关项目配置 用户登录验证 再网站开发中,用户登录验证的一个简单思路通常是将用户输入的信息与数据库中的信息比对,若一致则通过,反之,验证失败. 在本项目中,也采用这种验证方式。这里要用到数据库,Django默认采用自带的sqlite数据库,在这里无需对数据库做改动,若采用MySQL等其它数据库,需要对配置文件做些改动,这里不再详细描述。 django数据模型 这里可以将数据模型简单地理解为数据表,编写数据模型即设计数据库的表中有哪些内容,数据模型需要在应用中的models.py文件中编写。 下面为一个用户个人信息示例: class UserProfile ( models . Model ) : birth = models . DateTimeField ( max_length = 100 , blank = True ) phone = models . CharField ( max_length = 20 ) def __str__ ( self ) : return 'user {}' . format ( self . user . username ) 在这个模型中,包含了用户的’phone’,'birth’信息,由此可见

防止表单重复提交

情到浓时终转凉″ 提交于 2020-02-06 17:10:06
情况一:网络延迟,在网络延迟时间内,频繁的提交表单 解决方案: 只能提交一次,监控表单的提交事件,通过一个boolean类型的变量来区分已经点击过还是没有点击,如果已经点击过,表单就不提交,没有点击过再提交 //创建一个变量 false代表没有点击过,true代表已经点击过 var flag=false; function formSubmit() { if(!flag){ //取反值为false //提交过一次,修改标识 flag=true; return true; }else { return false; } } 这样提交过一次后就会一直进else块,return false; 情况二:重新加载或者后退页面 解决方案: 在加载页面的时候,创建一个Token令牌(当作一个标识) ,保存到session当中,然后在表单提交的时候将令牌一起提交 后台Servlet去判断session当中的令牌和表单提交的令牌是否相等,如果相等代表正常提交(并且将session清空),如果不相等,代表非正常提交 表单: <form action="FormServlet" onsubmit="return formSubmit()" method="post"> <%--页面加载时将生成的令牌保存在这个隐藏域中--%> <input type="hidden" id="hiddenToken"

django表单

时光怂恿深爱的人放手 提交于 2020-02-06 16:10:49
作用: 渲染表单模板。 表单验证数据是否合法。 django中表单使用流程: 像模版一样。首先我们要先定义一个表单类,继承自django.forms.Form。 #新建一个forms.py.from django import forms class MessageBoarForm(forms.Form): title = forms.CharField(max_length=100,min_length=2,label='标题',error_messages={'min_lenth':'至少要写一个字符'}) content = forms.CharField(widget=forms.Textarea,label='内容') email = forms.EmailField(label='邮箱') reply = forms.BooleanField(required=False,label='是否回复') #label时定义网页上显示的内容,error_messages是定义如果输入错误后提示的内容 接下来就是在view视图里,根据get或post请求操作。 from django.shortcuts import render from django.shortcuts import HttpResponse from django.views.generic import

跨域与防止表单重复提交

为君一笑 提交于 2020-02-06 15:19:46
什么是跨域? 跨域是指一个域下的文档或脚本试图去请求另一个域下的资源,这里跨域是广义的。 广义的跨域: 1.) 资源跳转: A链接、重定向、表单提交 2.) 资源嵌入: <link>、<script>、<img>、<frame>等dom标签,还有样式中background:url()、@font-face()等文件外链 3.) 脚本请求: js发起的ajax请求、dom和js对象的跨域操作等 其实我们通常所说的跨域是狭义的,是由浏览器同源策略限制的一类请求场景。 什么是同源策略? 同源策略/SOP(Same origin policy)是一种约定,由Netscape公司1995年引入浏览器,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,浏览器很容易受到XSS、CSFR等攻击。所谓同源是指"协议+域名+端口"三者相同,即便两个不同的域名指向同一个ip地址,也非同源。 同源策略限制以下几种行为: 1.) Cookie、LocalStorage 和 IndexDB 无法读取 2.) DOM 和 Js对象无法获得 3.) AJAX 请求不能发送 常见跨域场景 URL 说明 是否允许通信 http://www.domain.com/a.js http://www.domain.com/b.js 同一域名,不同文件或路径 允许 http://www.domain.com/lab/c

表单验证和MD5加密

泄露秘密 提交于 2020-02-06 03:28:35
表单验证和MD5加密 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <!--使用md5加密--> <script src="https://cdn.bootcss.com/blueimp-md5/2.12.0/js/md5.min.js"></script> </head> <body> <form action="http://baidu.com" method="post" onsubmit="return check()"> <p> <span>用户名:</span><input type="text" id="username" name="username"> </p> <p> <!--明文密码,会被network中直接抓取--> <span>密码:</span><input type="password" id="input-password"> </p> <!--md5密码--> <input type="hidden" id="md5-password" name="password"> <input type="submit" value="登录"> </form> <script> function check() { var uname =

Django ModelForm and Form

点点圈 提交于 2020-02-05 05:40:29
django表单系统中,所有的表单类都作为django.forms.Form的子类创建,包括ModelForm 关于django的表单系统,主要分两种 基于django.forms.Form 基于django.forms.ModelForm 表单API 表单有两种状态,绑定,未绑定 Form.is_bound() Form.is_valid() 验证表单数据是否合法,返回True或者False Form.errors 错误字典 Form.has_error(field,code=None) Form.initial 在表单未绑定的情况下,为表单字段设置初始值, >>> f=ContactForm(initial={'subject':'Hi there'}) Form.has_changed() 检查表单数据是否变化 From.cleaned_data 表单通过验证后,可以使用cleaned_data属性来访问‘清洁’的数据 Form.as_p() 将表单渲染成< p >标签 From.as_ul() 将表单渲染成< ul >标签 From.as_table() 将表单渲染成< table > 标签 但是这些都得自己添加<table ></table>;< ul >< /ul >标签 设置表单必填行与错误行的样式 Form.error_css_class Form.required

HTML5(8) 表单属性

心已入冬 提交于 2020-02-04 21:49:07
一、HTML5 新的表单属性 HTML5 的 <form> 和 <input>标签添加了几个新属性. <form>新属性: autocomplete novalidate <input>新属性: autocomplete autofocus form formaction formenctype formmethod formnovalidate formtarget height 与 width list min 与 max multiple pattern (regexp) placeholder required step 二、<form> / <input> autocomplete 属性 autocomplete 属性规定 form 或 input 域应该拥有自动完成功能。 当用户在自动完成域中开始输入时,浏览器应该在该域中显示填写的选项。 提示: autocomplete 属性有可能在 form元素中是开启的,而在input元素中是关闭的。 注意: autocomplete 适用于 <form> 标签,以及以下类型的 <input> 标签:text, search, url, telephone, email, password, datepickers, range 以及 color。 HTML form 中开启 autocomplete (一个 input 字段关闭

HTML5智能表单

依然范特西╮ 提交于 2020-02-04 14:29:07
一、HTML5新增输入类型   1.新增type类型     Type=“number” 专门用来输入数字的文本框     Type=“email” 限制用户必须输入email类型 “@”     Type=“url” 限制用户必须输入url类型 “http://”     Type=“range” 产生一个滑动条表单     Type=“search” 产生一个搜索意义的表单 <input type=”search” name=“name名”/>     Type=“color” 生成一个颜色选择的表单     Type=“time” 限制用户必须输入时间类型     Type=“month” 限制用户必须输入月类型     Type=“week” 限制用户必须输入周类型     Type=“datetime-local” 选取本地时间   2.智能表单类型名词解释     1)Number:专门用来输入数字的文本框;在提交时会检查其中的内容是否为数字,具有min(最小值)、max(最小值)、step(步幅,数字间隔,创建一系列有效数字)的属性;       例:<input name=“number1” type=“number” value=“25” min=“10” max=“100” step=“5” />     2)email:专门用来输入email地址的文本框

HTML 5之表单新功能解析

不想你离开。 提交于 2020-02-04 14:09:30
时光车轮滚滚碾来 , 前端之路永无止歇 . 对于这个前端这门精一多专的技术 , 任何一次技术革新 , 我们都必须第一时间去了解它学习它 , 比如 Web 世界里这簇美艳的花朵 ---HTML 5. 虽然 HTML 5 发布之初 , 许多人 ( 包括我 ) 都觉得普及它还很遥远 , 但自发布以来 , 许多企业级网站对它的尝试应用 ( 比如 <!doctype html> 应用 , 比如 canvas 的应用 ), 使 HTML 5 的迈出了一大步 , 随之而来 IE9 的发布 , 无疑又让我们看到了 HTML 5 离我们不再遥远 . 学习 HTML 5 半年有余了 , 虽然对它的离线存储以及 canvas 等革新性技术还是一知半解 , 但我还是希望我现在所学到的能帮助更多的前端人学习这门毋庸置疑是新趋势的技术 . 本文我将详细介绍一下 HTML 5 中对表单功能的更新 . 。 一、表单结构更自由 XHTML 中需要放在 form 之中的诸如 inpu/button/select/textarea 等标签元素 , 在 HTML 5 中完全可以放在页面任何位置 , 然后通过新增的 form 属性指向元素所属表单的 ID 值 , 即可关联起来 . 比如 : <form id="iform"> <input type="text"> ... </form> <input value=" 我在

HTML5之表单详解

拟墨画扇 提交于 2020-02-04 14:06:56
email输入类型 <INPUT type=email name=email> 此类型要求输入格式正确的email地址,否则浏览器是不允许提交的,并会有一个错误信息提示.此类型必须指定name值,否则无效果. url输入类型 <INPUT type=url> 上面代码展示的文本域要求输入格式正确的URL地址,Opera中会自动在开始处添加http://. 日期时间相关输入类型(这些个很牛X的) <INPUT type=date> <INPUT type=time> <INPUT type=month> <INPUT type=week> 这一系列是很酷的一个类型,完全解决了烦琐的JS日历控件问题.但目前MS只有Opera/Chrome新版本支持,且展示效果也不一样. number输入类型(这些个很牛X的) <INPUT type=number> 这个不用多解释了,要求输入一个数字字符,若未输入则会抛出一个错误. range输入类型 <INPUT type=range> 此类型将显示一个可拖动的滑块条,并可通过设定max/min/step值限定拖动范围.拖动时会反馈给value一个值. search输入类型 <INPUT type=search> 此类型表示输入的将是一个搜索关键字,通过results=s可显示一个搜索小图标. tel输入类型 <INPUT type=tel>