首页 > 其他分享 >FLASK学习记录-Flask表单(一)

FLASK学习记录-Flask表单(一)

时间:2024-03-30 13:22:52浏览次数:14  
标签:__ form FLASK app request 表单 Flask import label

 

Form表单是一个包含表单元素的区域,允许用户在表单中输入各种信息元素,是前后端交互的重要标签,Form标签常用属性如下:

 

 常用表单控件:

 实例:

app.py

from flask import Flask, render_template, request

app = Flask(__name__)

@app.route('/', methods=["get", "post"])
def index():
    if request.method == "POST":
        user1 = request.form.get('visitorName')
        pwd1 = request.form.get('password')
        return "visitor: {},password{}....".format(user1, pwd1)
    if request.method == "GET":
        return render_template("form_1.html")

if __name__ == '__main__':
    app.run(host='0.0.0.0',port=8000,debug=True)
View Code

form_1.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>form1</title>
</head>
<body>
<form action="/" method="post">
    <p>
        <label for="visitorName">访客登记名:</label><input type="text" name="visitorName" id="visitorName" placeholder="访客登记名">
    </p>
    <p><label for="password">密&emsp;码:</label><input type="password" name="password" id="password" placeholder="密码"></p>
    <p>
        性&emsp;别:
        <label><input type="radio" name="gender" value="male">男</label>
        <label><input type="radio" name="gender" value="female">女</label>
    </p>
    <p>
        领&emsp;域:
        <input type="checkbox" name="hobby" value="program">文科
        <input type="checkbox" name="hobby" value="music">理科
        <input type="checkbox" name="hobby" value="photo">工科
                <input type="checkbox" name="hobby" value="photo">文艺
                <input type="checkbox" name="hobby" value="photo">声乐
    </p>
    <p>
        上传文件:<input type="file">
    </p>

    <p>
        &emsp;址:
        <select name="addr" id="">
            <!--select是有级别之分的,比如某某省某某市的-->
            <optgroup label="广东省">
                <option value="sz">深圳</option>
                <!--selected 用来设置默认的城市-->
                <option value="gz" selected="selected">广州</option>
            </optgroup>
            <optgroup label="江西省">
                <option value="nc">南昌</option>
                <option value="ja">吉安</option>
            </optgroup>
        </select>
    </p>

    <p>
    <fieldset>
        <legend>个人留言:</legend>
        <textarea name="profile" rows="5" cols="50"></textarea>
    </fieldset>
    </p>
    <p>
        <input type="submit" value="提交">
        <input type="reset" value="重置">
    </p>
</form>
</body>
</html>
View Code

使用Flask-WTF

安装:pip install flask-wtf -i https://pypi.tuna.tsinghua.edu.cn/simple

WTForm常用字段,更多内容可参考官方文档 https://flask-wtf.readthedocs.io/en/1.2.x/

 常用验证器

 实例:

$ pip install email_validator -i https://pypi.tuna.tsinghua.edu.cn/simple

$ cat loginForm.py
from flask_wtf import FlaskForm
from wtforms import StringField,PasswordField
from wtforms.validators import  DataRequired,Length

class loginForm(FlaskForm):
      username=StringField(label='用户名',validators=[DataRequired(message='用户名不能为空')],render_kw={'placeholder':'输入用户名'})
      password=PasswordField(label='密码',validators=[DataRequired(),Length(8,12,message='lenth must between 8 and 12')])
View Code
$ cat registerForm.py
from flask_wtf import FlaskForm
from wtforms import StringField,PasswordField,SubmitField,IntegerField
from wtforms.validators import DataRequired, Length, NumberRange, EqualTo, ValidationError,Email
import email_validator
import re

class RegisterForm(FlaskForm):
    mobile = StringField(label='手机号', default='')
    email=StringField(label="邮箱",validators=[DataRequired('请输入密码'),Length(6,20),Email()])
    password = PasswordField(label='密码', validators=[DataRequired('请输入密码'),EqualTo('conpwd',message="两次密码不一致")])
    conpwd=PasswordField(label='确认密码', validators=[DataRequired('请再次输入密码')])
    age = IntegerField(label='年龄',validators=[NumberRange(min=18,max=50)])
    submit = SubmitField('注册')

    def validate_mobile(self, field):
        mobile= field.data
        pattern = r'^1[0-9]{10}$'
        if not re.search(pattern, mobile):
            raise ValidationError('手机号')
        return field
View Code
from flask import Flask, render_template, request
from loginForm import loginForm
from registerForm import RegisterForm

app = Flask(__name__)

@app.route('/', methods=["get", "post"])
def index():
    if request.method == "POST":
        user1 = request.form.get('visitorName')
        pwd1 = request.form.get('password')
        return "visitor: {},password{}....".format(user1, pwd1)
    if request.method == "GET":
        return render_template("form_1.html")

@app.route("/login", methods=["get", "post"])
def login():
    if request.method == "GET":
        return render_template("login.html")
    else:
        login = loginForm(request.form)
        if login.validate():
            return "success"
        else:
            return "pass"

@app.route("/register",methods=["get", "post"])
def register():
    form=RegisterForm()
    if form.validate_on_submit():
        username = form.username.data
        email=form.email.data
        password = form.password.data
        conpwd=form.conpwd.data
        age = form.age.data
        print("手机号:{},Email:{},密码:{},确认密码:{},年龄:{}".format(username,email,password,conpwd,age))
    else:
        print(form.errors)
    return render_template('register.html', form=form)

if __name__ == '__main__':
    app.run(host='0.0.0.0',port=8000,debug=True)
View Code

login.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>login</title>
</head>
<body>
<form  action="/login" method="post">
     <p>
         用户名:<input type="text" name="username">
     </p>
    <p>
        密码:<input type="password" name="password">
    </p>
    <p>
        <input type="submit" value="登录">
    </p>

</form>
</body>
</html>
View Code

register.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>register</title>
</head>
<body>

<form action="{{ url_for('register') }}" method="post">
    {{ form.csrf_token }}
    <p>
        {{ form.mobile.label }}
        {{ form.mobile}}
        {% if form.mobile.errors %}
            {% for err in form.mobile.errors %}
                <span>{{ err }}</span>
            {% endfor %}
        {% endif %}
    </p>
    <p>
        {{ form.email.label }}
        {{ form.email }}
        {% if form.email.errors %}
            {% for err in form.email.errors %}
                <span>{{ err }}</span>
            {% endfor %}
        {% endif %}
    </p>
    <p>
        {{ form.password.label }}
        {{ form.password }}

    </p>
    <p>
        {{ form.conpwd.label }}
        {{ form.conpwd }}
    </p>

    <p>
        {{ form.age.label }}
        {{ form.age }}
    </p>
    <p>
        {{ form.submit }}
    </p>

</form>
</body>
</html>
View Code

问题说明:访问注册接口“:8000/register”报错,“RuntimeError: A secret key is required to use CSRF.” 是因为Flask-WTF默认提供对每个表单免受跨站请求伪造的保护,解决办法是在app.py设置密钥,例如: app.config['SECRET_KEY'] = '123456', 或者app.secret_key='123456'

Flask-WTF文件上传:

设置上传文件大小不超过3MB

app.config['MAX_CONTENT_LENGTH']=3*1024*1024

 

标签:__,form,FLASK,app,request,表单,Flask,import,label
From: https://www.cnblogs.com/jackbond/p/18105375

相关文章

  • python+django在线政务便民服务系统flask
     随着时代在飞速进步,每个行业都在努力发展现在先进技术,通过这些先进的技术来提高自己的水平和优势,在线政务服务中心管理当然不能排除在外。在线政务服务中心管理系统是在实际应用和软件工程的开发原理之上,运用python语言以及vue框架进行开发。首先要进行需求分析,分析出在线政......
  • 某物登录表单加密
    之前分析过某物h5的以及小程序的搜索接口,就是一个aes,秘钥不固定,表单里把秘钥以及密文一起发过去,服务器解密后再把数据加密返回,客户端解密展示到页面上.这期是关于app的登录,密码登录声明本文章中所有内容仅供学习交流使用,不用于其他任何目的,不提供完整代码,抓包内容......
  • WPF中实现动态表单-来自GPT4的回答
    实现C#和WPF项目中的动态表单功能,需要在后端设计灵活的数据结构来存储表单配置(例如字段名、字段类型等),同时前端需要能够解析这些配置并据此生成相应的控件。以下是一种可能的实现方法:1.数据库设计你的数据库需要至少包含两个表:一个用于存储表单字段的配置,另一个用于存储用户输......
  • elementUI——el-form表单数据校验(包含数组循环)
    一、普通的值类型的数据校验①设置el-form-item的prop值与formdata中定义的key保持一致`②如果rules需要通过el-form统一设置,rules的key定义也与prop保持一致(如果不一致,需要在el-form-item中手动指定)③复杂的校验函数可通过validator单独定义<el-form......
  • 【python】深入探讨flask是如何预防CSRF攻击的
    ✨✨欢迎大家来到景天科技苑✨✨......
  • FLASK学习记录-宏、模板继承
    宏{%macroname%}{%endmacro%}app.pyfromflaskimportFlask,render_templateapp=Flask(__name__)@app.route('/')defindex1():returnrender_template("macro1.html")@app.route("/")defindex2():returnrend......
  • element-ui表单校验:有值却不通过 el-form validate
    解决:新增/编辑赋值的时候,所有明明有值校验不通过的属性使用$set赋值this.$set(this.form,"属性名","");//新增置空this.$set(this.form,"属性名",row.shuxing);//编辑赋值 ......
  • FLASK学习记录-Jinja2模块引擎
    Flask中引入了jinja2模板引擎,可以显示动态数据、数据过滤、语句控制、模板继承和引用等。实战实例app.pyfromflaskimportFlask,render_templateapp=Flask(__name__)@app.route('/')defindex():LibraryName="NationalLibrary"visitor={"name":"J......
  • Flask python 开发篇:模型(model)Flask-SQLAlchemy的使用
    Flask-SQLAlchemy实现模型一、为什么使用模型?二、Flask-SQLAlchemy的引入三、使用Flask-SQLAlchemy构建模型文件3.1、安装扩展3.2、配置3.3、实战使用3.4、与蓝图相结合使用一、为什么使用模型?上一篇分享了蓝图的使用,也说蓝图相当于了php中控制器+路由的使用,那根......
  • elementUI表单表头增加筛选
    1、增加过滤条件 2、定义数据,必须包含text以及value 3、使筛选的id与行内元素id一直进行筛选 4、对下拉icon大小更改 ......