qidao123.com技术社区-IT企服评测·应用市场»论坛 › 软件与程序人生 › DevOps与敏捷开发 › Flask学习条记 - 表单

Flask学习条记 - 表单

[复制链接]
发表于 8 小时前 | 显示全部楼层 |阅读模式
表单处置惩罚


  • 根本表单处置惩罚：使用 request.form 获取表单数据。
  • 使用 Flask-WTF：团结 WTForms 举行表单处置惩罚和验证，简化表单使用。
  • 表单验证：使用验证器确保表单数据的有用性。
  • 文件上传：处置惩罚文件上传和生存文件。
  • CSRF 掩护：确保表单免受跨站哀求伪造攻击。
根本表单处置惩罚

form.html
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.     <title>Form Example</title>
  5. </head>
  6. <body>
  7.     <form action="/submit" method="post">
  8.         <label for="name">Name:</label>
  9.         <input type="text" id="name" name="name">
  10.         <br>
  11.         <label for="email">Email:</label>
  12.         <input type="email" id="email" name="email">
  13.         <br>
  14.         <input type="submit" value="Submit">
  15.     </form>
  16. </body>
  17. </html>
复制代码
app.py
  1. @app.route('/form')
  2. def form():
  3.     return render_template('form.html')
  5. @app.route('/submit', methods=['POST'])
  6. def submit():
  7.     name = request.form.get('name')
  8.     email = request.form.get('email')
  9.     return f'Name: {name}, Email: {email}'
复制代码


request.form.get('变量名')，变量名是input中的name字段的值
使用 Flask-WTF 扩展

Flask-WTF 是一个封装了 WTForms 的扩展，提供了表单处置惩罚和验证的功能，使得表单处置惩罚更加简便和强盛。
安装 Flask-WTF

  1. pip install flask-wtf
  2. # 我的设备上有Python2.7和Python3,给Python3安装所以用以下的命令
  3. # pip3 install flask-wtf
复制代码

app.py
  1. from flask import Flask, render_template, redirect, url_for
  2. from flask_wtf import FlaskForm
  3. from wtforms import StringField, EmailField, SubmitField
  4. from wtforms.validators import DataRequired, Email
  6. app = Flask(__name__)
  7. app.secret_key = '6a31ad17a15b0d887049fcfd478aedeb8da2d40049f1413ca4add757379d4237'
  8.   # Required for form protection
  10. class MyForm(FlaskForm):
  11.     name = StringField('Name', validators=[DataRequired()])
  12.     email = EmailField('Email', validators=[DataRequired(), Email()])
  13.     submit = SubmitField('Submit')
  15. @app.route('/form', methods=['GET', 'POST'])
  16. def form():
  17.     form = MyForm()
  18.     if form.validate_on_submit(): # 如果校验通过则显示姓名与邮箱地址
  19.         name = form.name.data
  20.         email = form.email.data
  21.         return f'Name: {name}, Email: {email}'
  23.     return render_template('form.html', form=form) # 否则显示form.html页面
  25. if __name__ == '__main__':
  26.     app.run(debug=True)
复制代码
天生 app.secret_key

generate_secrets.py
  1. import secrets
  2. print(secrets.token_hex())
  3. # 6a31ad17a15b0d887049fcfd478aedeb8da2d40049f1413ca4add757379d4237
  4. # 64位的token
复制代码
表单处置惩罚和验证的功能

  1. name = StringField('Name', validators=[DataRequired()])
  2. email = EmailField('Email', validators=[DataRequired(), Email()])
复制代码
要求name和email非空,且email要符及格式
验证name和email

不输入name

不输入email

输入错误的email

输入name和准确格式的email

  1. Exception: Install 'email_validator' for email validation support.
复制代码
报错比力显着是还缺少emial_validator模块,通过下令行举行安装
  1. pip3 install email_validator
复制代码
继续哀求,报错消散,但界面没有出现下面的效果
  1. return f'Name: {name}, Email: {email}'
复制代码

一开始以为是html中的name和email是小写,导致提交时找不到元素,然而照旧不对。
IDE里的解释
# Call validate only if the form is submitted. This is a shortcut for form.is_submitted() and form.validate().
以是加了打印看时哪个函数报错,效果是form.validate()校验过程有题目,搜索相干资料,看怎么排查这个题目


  • 哀求方法错误 – POST哀求，不是这个题目
  • 表单数据错误 – 加上print(form.errors) 打印具体具体的错误 => {‘csrf_token’: [‘The CSRF tokens do not match.’]}
    …
是csrf_token未匹配的缘故因由,对比了别的几种写法,未发现有什么特别使用,此中提到清算欣赏器缓存的使用,我不停都是使用Trae IDE自带的欣赏器,抱着试一试的心态。用Chrome测试了下,是正常的!
我又问了Trae里的AI,看能不能告诉我怎么清算自带的欣赏器,然后它的答复,始终讲不到点上。
在Trae起的web服务和主机起的web服务,应该是有差异的。都用了5000端口,以是不能同时起,两者不能相互访问。每次验证都要在关闭web再启动，为了反面遇到希奇的题目可以用差异欣赏器去对比验证。
Trae和主机传差异的port参数可以办理这个题目
  1. import sys
  3. if __name__ == '__main__':
  4.     port = sys.argv[1] if len(sys.argv) > 1 else 5001
  5.     app.run(port=<port>,debug=True)
复制代码
Chrome欣赏器正常表现

表单验证

app.py
  1. class MyForm2(FlaskForm):
  2.     name = StringField('Name', validators=[
  3.         DataRequired(), Length(min=1, max=8)
  4.     ])
  5.     email = EmailField('Email', validators=[
  6.         DataRequired(), Email()
  7.     ])
  8.     submit = SubmitField('Submit')
  9.    
  10. @app.route('/form2', methods=['GET', 'POST'])
  11. def form2():
  12.     form = MyForm2()
  13.     if form.validate_on_submit():
  14.         name = form.name.data
  15.         email = form.email.data
  16.         return redirect(url_for('form'))
  17.     return render_template('form.html', form=form)
复制代码
设置了Length,name最长只能输入8个

文件上传

Flask 还支持处置惩罚文件上传。上传的文件可以通过 request.files 访问。
templates/upload.html
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.     <title>Upload File</title>
  5. </head>
  6. <body>
  7.     <form action="/upload" method="post" enctype="multipart/form-data">
  8.         <label for="file">File:</label>
  9.         <input type="file" id="file" name="file">
  10.         <br>
  11.         <input type="submit" value="Upload">
  12.     </form>
  13. </body>
  14. </html>
复制代码
app.py
  1. @app.route('/upload_file', methods=['GET'])
  2. def upload_form():
  3.     return render_template('upload.html')
  5. @app.route('/upload', methods=['POST'])
  6. def upload():
  7.     file = request.files.get('file')
  8.     if file:
  9.         filename = file.filename
  10.         file.save(f'uploads/{filename}')
  11.         return f'File uploaded successfully: {filename}'
  12.     return 'No file uploaded'
复制代码
访问/upload_file，选择文件并上传，上传乐成后在app.py同级目次uploads下



CSRF 掩护

Flask-WTF 自动为表单提供 CSRF 掩护。你必要设置一个密钥来启用 CSRF 掩护，并在模板中包罗潜伏的 CSRF 令牌。
设置CSRF掩护
app.py
  1. app.secret_key = '6a31ad17a15b0d887049fcfd478aedeb8da2d40049f1413ca4add757379d4237'
复制代码
在模板中添加 CSRF 令牌
  1. <form method="post">
  2.     {{ form.hidden_tag() }}
  3.     <!-- Form fields here -->
  4. </form>
复制代码
Demo

Flask
参考


  • Flask表单处置惩罚
  • Form Validation with WTForms
  • Flask WTF form.validate_on_submit()方法不起作用
  • flask总结05（在 Flask 项目中办理 CSRF 攻击）
  • Flask-WTF 表单令牌不匹配：The CSRF Tokens do not match

免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。
继续阅读请点击广告

本帖子中包含更多资源

您需要 登录 才可以下载或查看，没有账号？立即注册

×
回复

使用道具 举报

返回列表

海哥
+ 我要发帖
×
登录参与点评抽奖，加入IT实名职场社区
去登录
快速回复 返回顶部 返回列表