表单验证

web前端 | 博客(二)登录功能

扶醉桌前 提交于 2020-01-06 20:29:47
实现登录功能 创建用户集合,初始化用户 连接数据库 创建用户集合 初始化用户 为登录表单项设置请求地址,请求方式(GET方法会将参数放到地址栏中,不隐蔽,要用POST方法,它将参数放到消息体中,比较隐蔽)以及表单name属性 当用户点击登录按钮时,客户端验证用户是否填写了登录表单 如果其中一项没有输入,则阻止表单提交 服务器端请求接收参数,验证用户是否填写了登录表单(有时候客户端的js代码会被禁用,无法正确识别表单的准确性,故服务端的表单验证必不可少) 如果有一项没有输入,为客户端做出响应,阻止程序向下执行(例如,如果没有填写邮箱,则找不到该用户)(无论邮箱地址错误还是密码错误,一律提示两者都错,防止用户恶意猜出其他用户的账号密码) 根据邮箱地址查询用户信息 如果用户不存在,为客户端做出响应 如果用户存在,将用户名和密码进行比对 比对成功,则用户登录成功 比对失败,则则用户登录失败 数据库 数据库连接 在model中新建connect.js和user.js,分别用于数据库连接和创建用户集合。 connect.js //连接数据库 //引入mongoose第三方模块,这个对象下面有个connect方法用户连接数据库 const mongoose = require ( 'mongoose' ) ; //连接数据库 mongoose . connect ( 'mongodb:/

php登陆表单防注入练习

北城余情 提交于 2020-01-06 17:06:17
简单的表单登录代码,了解sql注入,禁止单引号还有反斜杠\ # and or order关键字的提交 数据库: 简单的源码: <!DOCTYPE html> <html> <head> <title>后台表单登录页面</title> <meta charset=UTF-8> </head> <body> <center> <h3>后台登录</h3> <form action="" method="POST"> 帐号: <input name='username' type='text'><br /> 密码: <input name='password' type='password'><br /> <input type='submit' value='登录'> </form> </center> </body> </html> <!--前后端都在一个页面上--> <?php //判断有数据才执行后端代码,什么都不输入还是前端登陆界面,防止前端没有数据,后端验证老是弹出 if(!empty($_REQUEST)){ //数据不为空和空格,赋值账号和密码,都转化为小写,两边去除空格,否则报错 $user = ! empty(trim($_REQUEST['username'])) ? trim(strtolower($_REQUEST['username'])) : die("

flask-WTForms

故事扮演 提交于 2020-01-06 10:07:01
WTForms表单验证基本使用 Flask-WTF是简化了WTForms操作的一个第三方库,WTForms表单的两个主要功能是验证用户提交数据的合法性以及渲染模板。当然还包括一些其他的功能:CSRF保护,文件上传等。安装Flask-WTF默认也会安装WTForms,因此使用以下命令来安装Flask-WTF pip install flask-wtf 这个库一般有两个作用:第一个就是做表单验证,把用户提交上来的数据进行验证是否合理。第二个就是做模板渲染 表单验证: 安装完Flask-WTF后。来看下第一个功能,就是用表单来做数据验证,现在有一个forms.py文件,然后再里面创建一个RegistForm的注册验证表单: 1.自定义一个表单类,继承自wtforms.Form类 2.定义好需要验证的字段,字段的名字必须和模板中那些需要验证的input标签的name属性值保持一致 3.在需要验证的字段上,需要指定好具体 的数据类型 4.在相关的字段上,指定验证器 5.以后再视图中,就只需要使用这个表单类的对象,并且把需要验证的数据,也就是request.form传给这个表单类,以后调用form.validate()方法,如果返回True,那么代表用户输入的数据都是合法的,否则代表用户输入的数据是有问题的。如果验证失败了,那么可以通过form.errors来获取具体的错误信息 示例代码如下

Sencha Touch权威指南

限于喜欢 提交于 2020-01-05 04:13:26
《Sencha Touch权威指南》 基本信息 作者: 陆凌牛 [作译者介绍] 出版社:机械工业出版社 ISBN:9787111395010 上架时间:2012-8-22 出版日期:2012 年8月 开本:16开 页码:1 版次:1-1 所属分类: 计算机 > 软件与程序设计 > 网络编程 > javascript 计算机 > 软件与程序设计 > 网络编程 > HTML 更多关于》》》《 Sencha Touch权威指南 》 内容简介 书籍 计算机书籍   如何才能全面而透彻地理解和掌握移动应用开发框架sencha touch并开发出令人心动的移动应用?本书将给我们满意的答案!它的内容系统而全面,细致地讲解了sencha touch的所有功能、特性、使用方法、开发技巧,让我们能做到对sencha touch了如指掌;它实战性强,不仅每个知识点都配有精心设计的小案例(具体的实现步骤、完整的实现代码、最终的实现效果,图文并茂),而且还有综合性的案例,能让我们迅速获得实战经验。本书所有实例代码都经调试运行成功,我们可以对这些代码进行修改,以便观察各种不同效果,加深对实例代码的理解。   第一部分(第1~2章):首先介绍了sencha touch的功能和特性,然后介绍了如何搭建开发环境和发布应用程序,以及sencha touch的相关基础知识;第二部分(第3~15章):这是本书的核心部分

一些常用的js正则表单验证

我是研究僧i 提交于 2020-01-05 00:39:48
前端一般为了防止用户误输入,或者为了使用户获取最快的反馈,常常在表单设置正则验证,下面就让我介绍几个常用的正则验证。大家也可以在demo里实际操作一下。 demo地址: 点击查看 html: <div class="inp_box"><h3>请输入整数(1):</h3><input type="text" placeholder="请输入" οninput="ele_match1(event)"/></div> <div class="inp_box"><h3>请输入数字(1):</h3><input type="text" placeholder="请输入" οninput="ele_match2(event)"/></div> <div class="inp_box"><h3>请输入整数(2)(推荐):</h3><input type="text" placeholder="请输入" οninput="ele_match3(event)"/></div> <div class="inp_box"><h3>请输入数字(2)(推荐):</h3><input type="text" placeholder="请输入" οninput="ele_match4(event)"/></div> <div class="inp_box"><h3>2位小数(1)(推荐):</h3><input

前端 HTML CSS

 ̄綄美尐妖づ 提交于 2020-01-04 02:55:43
今日主要内容: 列表标签 <ul>、<ol>、<dl> 表格标签 <table> 表单标签 <fom> 一、列表标签 列表标签分为三种。 1、无序列表 <ul> ,无序列表中的每一项是 <li> 英文单词解释如下: ul:unordered list,“无序列表”的意思。 li:list item,“列表项”的意思。 示例: <ul> <li>张三</li> <li>李四</li> <li>王五</li> </ul> 效果: 注意: li不能单独存在,必须包裹在ul里面;反过来说,ul的“儿子”不能是别的东西,只能有li。 我们这里再次强调,ul的作用,并不是给文字增加小圆点的,而是增加无序列表的“语义”的。 属性: type="属性值" 。属性值可以选: disc (实心原点,默认), square (实心方点), circle (空心圆)。 效果如下: 列表之间是可以 嵌套 的。我们来举个例子: 代码: <ul> <li><b>北京市</b> <ul> <li>海淀区</li> <li>朝阳区</li> <li>东城区</li> </ul> </li> <li><b>广州市</b> <ul> <li>天河区</li> <li>越秀区</li> </ul> </li> </ul> 效果: 声明:ul的儿子,只能是li。但是li是一个容器级标签,li里面什么都能放

表单操作

╄→尐↘猪︶ㄣ 提交于 2020-01-03 07:41:06
引言:JavaScript最早被设计出来就是为了实现对注册表单的验证,本文简单的介绍了JavaScript的表单操作 1.获取表单对象的方法 1.通过表单ID获取:document.getElementById("formId"); 2.通过表单的索引获取:document.forms[index]; 3.通过表单的name获取:document.forms["formName"]; document.formName; 2.表单对象常用的属性 name 获取或设置表单的 name 属性 action 获取或者设置表单提交的地址 elements 获取一个数组,包括该表单中所有的表单域 length 获取表单的表单域的数量 method 获取或设置表单的表单的提交方式:get(默认)、post enctype 获取或设置表单的编码方式:application/x-www-form-urlencoded(默认)、multipart/form-data、text/plain 3.get方式和post方式的区别 1.get的通过URL参数会显示在URL中,较不安全。 post的参数通过请求实体(Request body)传输,不会显示在URL中,相对安全。 2.get的参数长度有限制,长度视浏览器而定一般在2k左右。post的长度理论上是无限的 3.GET请求会被浏览器主动cache

html常用标签介绍

依然范特西╮ 提交于 2020-01-03 07:23:52
常用标签: HTML 标题 HTML 标题(Heading)是通过 <h1> - <h6> 等标签进行定义的。 HTML 段落 HTML 段落是通过 <p> 标签进行定义的。 HTML 链接 HTML 链接是通过 <a> 标签进行定义的。 实例 <a href="http://www.baidu.com">This is a link</a> HTML 图像 HTML 图像是通过 <img> 标签进行定义的。 实例 <img src="w3school.jpg" width="104" height="142" /> HTML 元素 HTML 元素指的是从开始标签(start tag)到结束标签(end tag)的所有代码。 开始标签 元素内容 结束标签 <p> This is a paragraph </p> <a href="default.htm" > This is a link </a> <br /> 注释:开始标签常被称为开放标签(opening tag),结束标签常称为闭合标签(closing tag)。 HTML 元素语法 HTML 元素以开始标签起始 HTML 元素以结束标签终止 元素的内容是开始标签与结束标签之间的内容 某些 HTML 元素具有空内容(empty content) 空元素在开始标签中进行关闭(以开始标签的结束而结束) 大多数 HTML

Form表单属性说明

ε祈祈猫儿з 提交于 2020-01-03 07:23:40
我们可以用<form>...</form>来创建一个表单向服务器提交数据,当然,仅仅是使用form标签是不行的,单纯的form标签没有任何作用。我们通过设置form标签的属性值以及为它添加子元素,从而达到上传数据以及和服务器进行通讯交互的目的。 <form>标签的属性规定了当前网页上传数据的地址和方式。 1.action属性 form标签的action属性的指规定了处理上传数据的页面,也可以理解为“上传数据并且跳转到该页面”,该页面需要对上传的数据进行查询或者保存,所以经常由php/jsp/aspx来担当。如: <form action="message.php"> 如果action的值为空或者#,则数据交由本页面处理。 2.accept-charset accept-charset属性的值规定了服务器使用哪一种字符集编码来处理本页面所上传的数据。常用的有“UTF-8”、“ISO-8859-1"、"gb2312"等。 3.method method即方法,规定了浏览器上传数据的方式。method只有两个值可以选择,分别是get和post,默认值是get。以下分别介绍这两种方法的特性。 (1)method="get"时: 1>采用 GET 方法发送数据时,浏览器会与表单处理服务器建立连接,然后直接在一个传输步骤中发送所有的表单数据:浏览器会将数据直接附在表单的 action 的

html5 新增表单属性

眉间皱痕 提交于 2020-01-03 07:14:22
1 required 属性 required 属性规定必须在提交之前填写输入域(不能为空)。 注释:required 属性适用于以下类型的 <input> 标签:text, search, url, telephone, email, password, date pickers, number, checkbox, radio 以及 file。 实例 Name: <input type="text" name="usr_name" required="required" /> 2 placeholder 属性 placeholder 属性提供一种提示(hint),描述输入域所期待的值。 注释:placeholder 属性适用于以下类型的 <input> 标签:text, search, url, telephone, email 以及 password。 提示(hint)会在输入域为空时显示出现,会在输入域获得焦点时消失: < input type="search" name="user_search" placeholder ="Search W3School" /> 3 pattern 属性 pattern 属性规定用于验证 input 域的模式(pattern)。 模式(pattern) 是正则表达式。。 注释:pattern 属性适用于以下类型的 <input> 标签