flask实现一个登录界面

在这里插入图片描述

flask实现一个登录界面

基础的Flask项目结构

  1. forms.py:定义登录表单和表单字段的文件。
  2. templates/login.html:用于渲染登录表单的 HTML 模板文件。
  3. routes.py:定义应用的路由和视图函数的文件。
  4. __init__.py:创建并初始化 Flask 应用的文件。
  5. run.py:启动应用的文件。
/myproject/myproject__init__.pyroutes.pyforms.py/templateslogin.html/staticrun.py

安装 Flask 和 Flask-WTF (一个用于处理表单的 Flask 扩展):

pip install flask flask-wtf

创建表单的定义 (forms.py):

from flask_wtf import FlaskForm
from wtforms import StringField, PasswordField, SubmitField
from wtforms.validators import DataRequiredclass LoginForm(FlaskForm):username = StringField('Username', validators=[DataRequired()])password = PasswordField('Password', validators=[DataRequired()])submit = SubmitField('Login')

这个文件中,我们定义了一个名为 LoginForm 的类,它代表登录表单。这个表单有两个字段:username 和 password,这两个字段都使用了 DataRequired 验证器,意味着这两个字段是必填的。在表单的最后,我们还定义了一个 submit 字段,它是一个提交按钮。

创建一个 HTML 模板来渲染表单 (templates/login.html):

<html>
<body><form method="POST">{{ form.hidden_tag() }}<p>{{ form.username.label }}<br>{{ form.username(size=32) }}</p><p>{{ form.password.label }}<br>{{ form.password(size=32) }}</p><p>{{ form.submit() }}</p></form>
</body>
</html>

这个 HTML 文件定义了一个表单,它使用 POST 方法提交。这个表单的每个字段都来自 LoginForm 类。我们使用了 Flask-WTF 提供的特殊语法 {{ form.field_name }} 来渲染这些字段。使用这种方式,Flask-WTF 会自动处理字段的渲染,包括字段的验证错误等。

routes.py 文件中定义一个路由,以处理表单的提交和页面的渲染:


from flask import Flask, render_template, flash, redirect, url_for
from .forms import LoginFormapp = Flask(__name__)
app.config['SECRET_KEY'] = 'you-will-never-guess'@app.route('/login', methods=['GET', 'POST'])
def login():form = LoginForm()if form.validate_on_submit():flash('Login requested for user {}, remember_me={}'.format(form.username.data, form.remember_me.data))return redirect(url_for('login'))return render_template('login.html', title='Sign In', form=form)

在这个文件中,我们首先创建了一个 Flask 应用,并且设置了一个名为 ‘SECRET_KEY’ 的配置项,这个配置项用于启用所有 Flask 和某些其扩展的加密功能。

然后我们定义了一个名为 login 的视图函数。这个函数首先创建了一个 LoginForm 实例,然后检查这个表单是否通过了所有的验证(即所有的字段都已填写)。如果表单通过了验证,我们会显示一条消息,然后重定向到登录页。否则,我们会渲染登录模板,并将表单传递给模板。

form.validate_on_submit()是Flask-WTF扩展提供的一个方便的方法,它将处理表单提交的所有事务。

当你在视图函数中调用form.validate_on_submit(),它将会做两件事:

  1. 它首先检查请求方法是否是 POST 或 PUT,这两种方法常常用于提交表单。在 HTTP 协议中,GET 请求通常用于获取数据,而 POST 和 PUT 请求通常用于提交数据。
  2. 如果请求方法是 POST 或 PUT,那么 validate_on_submit() 进一步调用 form.validate() 来运行每个字段的验证器。这些验证器是在你的 Form 类中定义的(例如在 LoginForm 中的 DataRequired)。如果所有的字段都通过了验证,form.validate() 将返回 True,否则返回 False。

所以,如果 form.validate_on_submit() 返回 True,那么这意味着客户端发起了一个 POST 或 PUT 请求,且所有的字段都已填写(通过验证)。这是提交表单的一个常见模式。

__init__.py中,引入并初始化 Flask 应用和路由:

from flask import Flask
from .routes import app

创建一个run.py来启动应用:

from myproject import appif __name__ == '__main__':app.run(debug=True)

补充

FlaskForm(或者更准确地说,它的基类 Form)的字段类型由 WTForms 库提供。以下是一些常用的字段类型:

  1. StringField:用于处理 <input type="text"> 类型的 HTML 表单元素。
  2. PasswordField:用于处理 <input type="password"> 类型的 HTML 表单元素。
  3. TextAreaField:用于处理 <textarea> 类型的 HTML 表单元素。
  4. HiddenField:用于处理 <input type="hidden"> 类型的 HTML 表单元素。
  5. DateField:用于处理含有 date 数据的表单元素。
  6. DateTimeField:用于处理含有 datetime 数据的表单元素。
  7. IntegerField:用于处理 <input type="number"> 类型的 HTML 表单元素。
  8. DecimalField:用于处理含有 decimal 数据的表单元素。
  9. FloatField:用于处理含有 float 数据的表单元素。
  10. BooleanField:用于处理 <input type="checkbox"> 类型的 HTML 表单元素。
  11. RadioField:用于处理 <input type="radio"> 类型的 HTML 表单元素。
  12. SelectField:用于处理 <select> 类型的 HTML 表单元素。
  13. SelectMultipleField:用于处理可以选择多个选项的 <select> 类型的 HTML 表单元素。
  14. FileField:用于处理 <input type="file"> 类型的 HTML 表单元素。
  15. SubmitField:用于处理 <input type="submit"> 类型的 HTML 表单元素。

所有这些字段都可以附加一个或多个验证器,如 DataRequiredLengthEmail 等,用于验证用户输入的数据。

你可以选择使用这些字段中的任何一个来创建你的表单。只需在你的 FlaskForm 子类中定义一个类变量,并将其设置为你选择的字段类型的实例即可。例如,username = StringField('Username', validators=[DataRequired()])

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/10202.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Java Spring和Spring集成Mybatis

0目录 1.Spring 2.Spring集成Mybatis 1.Spring 特性 IOC&#xff1a;控制反转 AOP&#xff1a;面向切面 Spring组成部分 在SMM中起到的作用&#xff08;粘合剂&#xff09; Spring理念 OOP核心思想【万物皆对象】 Spring核心思想【万物皆Bean组件】 Spring优势 低侵入式 …

基于新浪微博海量用户行为数据、博文数据数据分析:包括综合指数、移动指数、PC指数三个指数

基于新浪微博海量用户行为数据、博文数据数据分析&#xff1a;包括综合指数、移动指数、PC指数三个指数 项目介绍 微指数是基于海量用户行为数据、博文数据&#xff0c;采用科学计算方法统计得出的反映不同事件领域发展状况的指数产品。微指数对于收录的关键词&#xff0c;在指…

Java运算符

大体上&#xff0c;与C语言差不多&#xff0c;不同的地方&#xff0c;我用红色字体标注了 算术运算符 1. 基本四则运算符&#xff1a;加减乘除模 ( - * / %) int a 10 ; int b 20 ; System . out . println ( a b ); // 30 System . out . println ( a - b…

数据结构--线性表2-1

目录 一、线性结构的定义 二、线性表的表示 三、顺序表的实现&#xff08;或操作&#xff09; 1、修改&#xff1a; 2、插入&#xff1a; 四、顺序表的运算效率分析&#xff1a;时间效率分析&#xff1a; 一、线性结构的定义 若结构时非空有限集&#xff0c;则有且仅有一个…

8 个线程池最佳实践和坑!使用不当直接生产事故!!

这篇文章我会简单总结一下我了解的使用线程池的时候应该注意的坑以及一些优秀的实践。拿来即用&#xff0c;美滋滋&#xff01; 1、正确声明线程池 线程池必须手动通过 ThreadPoolExecutor 的构造函数来声明&#xff0c;避免使用Executors 类创建线程池&#xff0c;会有 OOM …

基于深度学习淡水鱼体重智能识别模型研究

工作原理为&#xff1a;首先对大众淡水鱼图片进行数据清洗并做标签分类&#xff0c;之后基于残差网络ResNet50模型进行有监督的分类识别训练&#xff0c;获取识别模型。其次通过搭建回归模型设计出体重模型&#xff0c;对每一类淡水鱼分别拟合出对应的回归方程&#xff0c;将获…

Android OpenGL ES Camera2 实现实时抠图效果

前面文章人像抠图 + OpenGL ES 还能这样玩?没想到吧,我们介绍了利用人像抠图算法生成的 mask 图,然后结合 OpenGL 可以产生一些有趣的效果。 抠图技术应用很广泛,比如很多手机的相机自带“人像留色”滤镜:人体区域保留彩色,人体区域之外灰度化。所以人像留色的关键技术在…

【vue】Vue中解读关于this.$emit()的用法:

文章目录 一、Vue.sync修饰符与this.$emit(‘update:xxx‘, newXXX)二、this.$emit()传多个参数 一、Vue.sync修饰符与this.$emit(‘update:xxx‘, newXXX) 二、this.$emit()传多个参数

Qt Core学习日记——第八天QMetaObject(下)

QMetaObject::normalizedType 将名称规范化。 例如&#xff1a; QByteArray normType QMetaObject::normalizedType(" int const *"); // normType is now "const int*" QMetaObject::connect(const QObject *sender, int signal_index, const QObject…

Jmeter性能测试配置

Jmeter检查点/断言 在上一章节中&#xff0c;我们通过调试脚本&#xff0c;通过人工验证脚本可以完成业务功能&#xff0c; 但在性能测试中&#xff0c;我们希望能通过自动验证脚本是否完成业务功能&#xff0c;在Jmeter 中我们可以通过检查点&#xff0c;也就是断言来实现自动…

VR全景在酒店的发展状况如何?酒店该如何做营销?

现阶段&#xff0c;VR全景技术已经被酒店、民宿、旅游景区、房产楼盘、校园等行业所应用&#xff0c;每天都有不少人通过VR全景展示来了解酒店的设施环境&#xff0c;而酒店也可以借此机会&#xff0c;详细展示自身优势&#xff0c;更大范围吸引顾客。 VR酒店拥有真实、立体的全…

Git Gui相关术语

文章目录 Git Gui主界面相关术语- Amend Last Commit&#xff08;修正最后一次提交&#xff09;- Rescan&#xff08;重新扫描&#xff09;- Sign Off&#xff08;签名&#xff09;- Stage Changed Git Gui Commit菜单相关术语- Stage to Commit&#xff08;暂存到提交&#xf…

opencv hand openpose

使用opencv c 来调用caffemodel 使用opencv 得dnn 模块调用 caffemodel得程序&#xff0c;图片自己输入就行&#xff0c;不做过多得解释&#xff0c;看代码清单。 定义手指关节点 const int POSE_PAIRS[20][2] { {0,1}, {1,2}, {2,3}, {3,4}, // thumb {0,5}, {5,6}, {6,7}…

Pytest框架 之【用例执行顺序】

今天在使用pytest执行用例过程中&#xff0c;使用了debug调试代码时&#xff0c;偶然发现&#xff0c;执行用例时不是自上而下的&#xff0c;pytest 中的用例执行顺序与unittest 是不一样的&#xff0c;pytest有默认的执行顺序&#xff0c;还可以自定义执行顺序。而在unittest框…

Linux 学习记录58(ARM篇)

Linux 学习记录58(ARM篇) 本文目录 Linux 学习记录58(ARM篇)一、GIC相关寄存器1. 系统框图2. 中断号对应关系 二、GICD寄存器1. GICD_CTLR2. GICD_ISENABLERx3. GICD_IPRIORITYRx4. GICD_ITARGETSRx5. GICD_ICPENDRx 三、GICC寄存器1. GICC_PMR2. GICC_CTLR3. GICC_IAR4. GICC_…

软工导论知识框架(二)结构化的需求分析

本章节涉及很多重要图表的制作&#xff0c;如ER图、数据流图、状态转换图、数据字典的书写等&#xff0c;对初学者来说比较生僻&#xff0c;本贴只介绍基础的轮廓&#xff0c;后面会有单独的帖子详解各图表如何绘制。 一.结构化的软件开发方法&#xff1a;结构化的分析、设计、…

Jenkins 还可以支持钉钉消息通知?一个插件带你搞定!

Jenkins 作为最流行的开源持续集成平台&#xff0c;其强大的拓展功能一直备受测试人员及开发人员的青睐。大家都知道我们可以在 Jenkins 中安装 Email 插件支持构建之后通过邮件将结果及时通知到相关人员。 但其实 Jenkins 还可以支持钉钉消息通知&#xff0c;其主要通过 Ding…

Log4j源码解析

Log4j源码解析 主要流程 Logger logger Logger.getLogger(Main.class); 1、通过Logger.getLogger(Class clazz) 或 Logger.getLogger(String name)进入。 2、加载LogManager进jvm, 执行静态代码块执行初始化, 创建出RepositorySelector实例及LoggerRepository实例(Hierarchy…

如何提高自动化测试覆盖率

实施自动化测试最重要的就是要保证其可用性&#xff0c;而不少同学写了不少自动化测试用例&#xff0c;但感觉到其可用性不高。究其原因&#xff0c;不是自动化测试本身的问题&#xff0c;是实施自动化测试的时候没有考虑周全。 第一&#xff0c;不合事宜地引入自动化测试 在公…

轻量级Web报表工具ActiveReportsJS全新发布v4.0,支持集成更多前端框架!

ActiveReportsJS 是一款基于 JavaScript 和 HTML5 的轻量级Web报表工具&#xff0c;采用拖拽式设计模式&#xff0c;不需任何服务器和组件支持&#xff0c;即可在 Mac、Linux 和 Windows 操作系统中&#xff0c;设计多种类型的报表。ActiveReportsJS 同时提供跨平台报表设计、纯…