Python编程
搜索
分类

python中Flask Web 表单的使用方法介绍

作者：??小志Codings???? 时间：2023-08-26 15:13:24　

简介

表单的操作是Web程序开发中最核心的模块之一，绝大多数的动态交互功能都是通过表单的形式实现的。本文会教大家实现简单的表单操作。

普通表单提交

在创建模板login.html页面中直接写form表单。

login.html

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>Document</title>
</head>
<body>
   <form action="" method="post">
       <input type="text" name="username" placeholder="Username">
       <input type="password" name="password" placeholder="Password">
       <input type="submit" value="提交">
   </form>
   {％ if method == 'GET' ％}
       请求方式：{{method}}
   {％ elif method == 'POST' ％}
       请求方式：{{method}}
       用户名：{{ username }}
       密码：{{ password }}
   {％ endif ％}
   
</body>
</html>

接下来，在视图函数中获取表单数据

login.py

from flask import Flask, render_template, request
app = Flask(__name__)
# index 视图函数
@app.route('/login', methods=['GET', 'POST'])
def login():
   context = dict()
   if request.method == 'POST':
       username = request.form['username']
       password = request.form['password']
       print(username, password)
       context = {
           'username': username,
           'password': password,
       }
       context.update({'method': request.method})
   else:
       context.update({'method': request.method})
   return render_template('login.html', **context)
@app.route('/')
def index():
   return 'hello'
if __name__ == '__main__':
   app.run(debug=True)

python中Flask Web 表单的使用方法介绍

当我们点击提交之后，则会显示：

python中Flask Web 表单的使用方法介绍

上面的实现方式是直接采用表单的提交方式。但是有个弊端，假如参数很多的情况下，后台也需要一一进行验证，每次都是先接收参数，再对参数进行校验的话，工作量就会非常的庞大，而且还会出现csrf攻击，这时我们就可以采用Flask-WTF来创建表单，从而避免上述弊端。

Flask-WTF基础

Flask-WTF的主要作用是对用户的请求数据进行验证。我们可以使用pip命令安装该依赖，

pip install flask-wtf

在flask web程序中，因为类FlaskForm由Flask-WTF拓展定义，所以可以从flask.wtf中导入FlaskForm。而字段和函数可以直接从WTForms包中导入，WTForms包中可以支持如下所示的HTML标准字段。

字段说明
StringField表示文本字段
TextAreaField表示多行文本字段
PasswordField表示密码文本字段
HiddenField表示隐藏文本字段
DateField表示日期的文本字段
DateTimeFiled表示时间的文本字段
IntegerFiled表示整数类型的文本字段
DecimalField表示Decimal类型的文本字段
FloatFiled表示Float类型的文本字段
RadioFiled表示单选框字段
SelectFiled表示下拉列表字段

WTForm也包含验证器，它对表单字段进行验证，非常方便。

字段说明
DataRequire检查输入的字段是否为空
Email检查字段是否符合邮件格式的约定
IPAddress在输入字段中验证IP地址
Length验证输入字段中的字符串长度是否符合给定长度
NumberRange验证给定范围内输入字段中的文字
URL验证是否为合法的URL

使用Flask-WTF处理表单

编写两个视图函数，以及一个form表单类，用于注册以及跳转index页面。

login.py

from flask import Flask, render_template, redirect, url_for, session
from flask_wtf import FlaskForm
from wtforms import StringField, PasswordField, SubmitField
from wtforms.validators import DataRequired, EqualTo
app = Flask(__name__)
app.config["SECRET_KEY"] = "xhosd6f982yfhowefy29f"
class RegisterForm(FlaskForm):
   username = StringField(label="用户名", validators=[DataRequired('用户名不能为空')])
   password = PasswordField(label="密码", validators=[DataRequired('密码不能为空')])
   password_comfirm = PasswordField(label="确认密码", validators=[DataRequired('密码不能为空'), EqualTo('password', '两次密码不一致')])
   submit = SubmitField(label='提交')
@app.route('/register', methods=['GET', 'POST'])
def register():
   form  = RegisterForm()
   if form.validate_on_submit():
       uname = form.username.data
       pwd = form.password.data
       pwd_com = form.password_comfirm.data
       print(uname, pwd, pwd_com)
       session['username'] = uname
       return redirect(url_for('index'))
   return render_template('register.html', form=form)
@app.route('/index')
def index():
   username = session.get('username', '')
   return 'hello ％s' ％ username
if __name__ == '__main__':
   app.run(debug=True)

接下来编写一个html模板文件，用于用户注册使用。

register.html

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>Document</title>
</head>
<body>
   <form action="" method="post">
       {{form.csrf_token}}
       {{form.username.label}}
       <p>{{ form.username }}</p>
       {％ for msg in form.username.errors ％}
           <p>{{ msg }}</p>
       {％ endfor ％}

       {{form.password.label}}
       <p>{{ form.password }}</p>
       {％ for msg in form.password.errors ％}
           <p>{{ msg }}</p>
       {％ endfor ％}

       {{form.password_comfirm.label}}
       <p>{{ form.password_comfirm }}</p>
       {％ for msg in form.password.errors ％}
           <p>{{ msg }}</p>
       {％ endfor ％}

       {{ form.submit }}
   </form>
</body>
</html>

Flask消息闪现

在Flask框架中，方法flash()功能是实现消息闪现提示效果。Flask官方对闪现的解释是对用户的请求做出无刷新的响应。类似于Ajax的刷新效果。

举一个简单的例子，当用户通过表单发送完请求之后，假如用户名或者是密码输入错误，那么服务器就会返回错误的提示信息，并在表单页面上显示。

具体代码，如下所示：

login.py

from flask import Flask, flash, redirect, render_template, request, url_for
app = Flask(__name__)
app.secret_key = 'random string'
@app.route('/')
def index():
   return render_template('index.html')
@app.route('/login', methods=['GET', 'POST'])
def login():
   error = None
   if request.method == 'POST':
       if request.form['username'] != 'admin' or request.form['password'] != 'admin':
           flash("用户名或密码错误")
       else:
           flash('登录成功')
           return redirect(url_for('index'))
   return render_template('login.html')
if __name__ == '__main__':
   app.run(debug=True)

login.html

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>登录</title>
</head>
<body>
   <form action="" method="post">
       <p>username</p>
       <input type="text" name="username">
       <p>password</p>
       <input type="password" name="password">
       <input type="submit" value="登录">
   </form>
   {％ for message in get_flashed_messages() ％}
       {％ if message ％}
           {{message}}
       {％ endif ％}
   {％ endfor ％}
</body>
</html>

index.html

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>Document</title>
</head>
<body>
   {％ with messages = get_flashed_messages() ％}
       {％ if messages ％}
           {％ for message in messages ％}
               <p>{{ message }}</p>
           {％ endfor ％}
       {％ endif ％}
   {％ endwith ％}
   <h3>welcome</h3>
   <a href="{{url_for('login')}}" rel="external nofollow" >login</a>
</body>
</html>

上面的代码实现了URL的跳转，我们首先会进入首页，首页中包含了进入登录页面的链接。

python中Flask Web 表单的使用方法介绍

python中Flask Web 表单的使用方法介绍

python中Flask Web 表单的使用方法介绍

文件上传

在Flas Web程序中要实现文件的上传非常简单，与传递post和get非常的类似。基本流程如下：

  • （1）将在客户端上传的文件保存到flask.request.files对象。

  • （2）使用flask.request.files对象获取上传上来的文件名和文件对象

  • （3）调用文件对象中的方法save()将文件保存到指定的目录中。

简易的文件上传程序如下所示：

upload.py

from flask import Flask, flash, render_template, request
app = Flask(__name__)

@app.route('/upload', methods=['GET', 'POST'])
def upload():
   if request.method == 'GET':
       return render_template('upload.html')
   else:
       file = request.files['file']
       if file:
           file.save(file.name + '.png')
           return '上传成功'
@app.route('/')
def index():
   return render_template('index.html')
if __name__ == '__main__':
   app.run(debug=True)

index.html

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>Document</title>
</head>
<body>
   <h1>文件上传首页</h1>
   <a href="{{url_for('upload')}}" rel="external nofollow" >文件上传</a>
</body>
</html>

upload.html

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>文件上传</title>
</head>
<body>
   <form action="" method="post" enctype="multipart/form-data">

       <input type="file" name="file">
       <input type="submit" value="点击我上传">
   </form>
</body>
</html>

本程序需要点击跳转之后才能进入文件上传页面，这样写的目的只是因为我比较懒，不想再浏览器中输入一大串的url。

python中Flask Web 表单的使用方法介绍

python中Flask Web 表单的使用方法介绍

python中Flask Web 表单的使用方法介绍

python中Flask Web 表单的使用方法介绍

目前上述程序仅仅可以上传图片！

文件上传的另一种写法

在Flask中上传文件的步骤非常简单，首先需要一个HTML表单，将enctype属性设置为"multipart/form-data"即可。URL处理程序会从request.file[]对象中提取文件，并将它保存到所需要的位置上。

每个上传的文件首先会保存到服务器上的临时位置，然后将其保存到最终的实际位置。建议使用secure_filename函数获取。

index.html

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>Document</title>
</head>
<body>
   <form action="/uploader" method="post" enctype="multipart/form-data">
       <input type="file" name="file">
       <input type="submit" value="提交">
   </form>
</body>
</html>

upload.py

from flask import Flask, render_template, request
from werkzeug.utils import secure_filename
import os
app = Flask(__name__)
app.config['UPLOAD_FLODER']= 'upload/' # 设置文件保存的路径
@app.route('/')
def upload_file():
   return render_template('upload.html')
@app.route('/uploader', methods=['GET', 'POST'])
def uploader():
   if request.method == 'POST':
       f = request.files['file']
       print(request.files)
       f.save(os.path.join(app.config['UPLOAD_FLODER'], secure_filename(f.filename)))
       return '上传成功'
   else:
       render_template('upload.html')
if __name__ == '__main__':
   app.run(debug=True)

来源：https://juejin.cn/post/7094906020157194270

标签：python,Flask,表单
0
投稿

猜你喜欢

  • Python实现的最近最少使用算法

    2022-07-10 22:48:27

  • python中__call__方法示例分析

    2023-01-16 04:31:31

  • python调用DLL与EXE文件截屏对比分析

    2022-06-01 08:19:15

  • Python匹配中文的正则表达式

    2022-03-21 18:05:50

  • gorm操作MySql数据库的方法

    2024-01-20 14:15:00

  • Python实现把多维数组展开成DataFrame

    2021-06-17 09:08:28

  • PyQt5实现简单的计算器

    2022-09-27 07:44:39

  • vue中的面包屑导航组件实例代码

    2024-05-02 17:11:28

  • python随机模块random的22种函数(小结)

    2022-08-11 18:09:03

  • Base64编码的深入认识与理解

    2023-03-05 08:44:01

  • Python time三种时间转换小结

    2022-05-15 18:38:20

  • Python Pillow.Image 图像保存和参数选择方式

    2023-03-03 03:36:54

  • YOLOV5代码详解之损失函数的计算

    2022-06-09 02:01:58

  • Python爬虫Xpath定位数据的两种方法

    2022-07-03 16:36:53

  • python列表的切片与复制示例分析

    2023-07-15 02:12:34

  • 时间序列分析之ARIMA模型预测餐厅销量

    2023-07-09 13:53:59

  • javascript cookies 设置、读取、删除实例代码

    2024-04-19 10:01:51

  • 浅谈flask源码之请求过程

    2023-12-17 10:36:48

  • Python和GO语言实现的消息摘要算法示例

    2023-03-27 02:07:05

  • mac下安装mysql忘记密码的修改方法

    2024-01-25 17:34:01
    • asp之家 网络编程 m.aspxhome.com