Python Flask：表单

来自CloudWiki
跳转至： 导航， 搜索

展示表单页面

python代码

hello.py: 

from flask import Flask
from flask import Flask, render_template, flash, redirect, url_for, session, request, logging
app = Flask(__name__)#创建一个该类的实例，第一个参数是应用模块或者包的名称


# 用户登录
@app.route('/login', methods=['GET', 'POST'])
def login():
    return render_template('login.html')

if __name__ == '__main__':#程序入口
    #app.run()#让应用运行在本地服务器上。
    #app.secret_key='secret123'
    app.run(host='0.0.0.0',port="5006",debug="true") #允许任意网址访问本站

html代码

login.html: 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    <div class="content">
  <h1 class="title-center">用户登录</h1>
  <form action="" method="POST" onsubmit="return checkLogin()">
    <div class="form-group">
      <label>用户名</label>
      <input type="text" name="username" class="form-control" value={{request.form.username}}>
    </div>
    <div class="form-group">
      <label>密码</label>
      <input type="password" name="password" class="form-control" value="">
    </div>
    <button type="submit" class="btn btn-primary">登录</button>
  </form>
</div>

<script>
  function checkLogin(){
      var username = $("input[name='username']").val()
      var password = $("input[name='password']").val()
      // 检测用户名长度
      if ( username.length < 2  || username.length > 25){
        alert('用户名长度在2-25个字符之间')
        return false;
      }
      // 检测密码长度
      if ( username.length < 2  || username.length > 25){
        alert('密码长度在6-20个字符之间')
        return false;
      }
  }
</script>
</body>
</html>

测试

python hello.py 

Python2023012101.png

处理表单数据

python代码

from flask import Flask
from flask import Flask, render_template, flash, redirect, url_for, session, request, logging
app = Flask(__name__)#创建一个该类的实例，第一个参数是应用模块或者包的名称

# 控制台
@app.route('/dashboard', methods=['GET', 'POST'])
def dashboard():
    return "欢迎光临"

# 用户登录
@app.route('/login', methods=['GET', 'POST'])
def login():
    if "logged_in" in session:  # 如果已经登录，则直接跳转到控制台
        return redirect(url_for("dashboard"))

    if request.method == 'GET': # 如果展示表单
        return render_template('login.html')
    elif request.method == 'POST':#如果是提交表单
        # 从表单中获取字段
        username = request.form['username']
        password_candidate = request.form['password']
        if username=="zhangsan" and password_candidate =="123456" : # 如果查到记录
            # 写入session
            session['logged_in'] = True
            session['username'] = username
            flash('登录成功！', 'success') # 闪存信息
            return redirect(url_for('dashboard')) # 跳转到控制台
        else:  # 如果密码错误
            error = '用户名和密码不匹配'
            return render_template('login.html', error=error) # 跳转到登录页，并提示错误信息



if __name__ == '__main__':#程序入口
    #app.run()#让应用运行在本地服务器上。
    app.secret_key='secret123'
    app.run(host='0.0.0.0',port="5006",debug="true") #允许任意网址访问本站

html模板

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    <div class="content">
  <h1 class="title-center">用户登录</h1>
  <div  style="color:red;">{{error}}</div>
  <form action="" method="POST" onsubmit="return checkLogin()">
    <div class="form-group">
      <label>用户名</label>
      <input type="text" name="username" class="form-control" value={{request.form.username}}>
    </div>
    <div class="form-group">
      <label>密码</label>
      <input type="password" name="password" class="form-control" value="">
    </div>
    <button type="submit" class="btn btn-primary">登录</button>
  </form>
</div>

<script>
  function checkLogin(){
      var username = $("input[name='username']").val()
      var password = $("input[name='password']").val()
      // 检测用户名长度
      if ( username.length < 2  || username.length > 25){
        alert('用户名长度在2-25个字符之间')
        return false;
      }
      // 检测密码长度
      if ( username.length < 2  || username.length > 25){
        alert('密码长度在6-20个字符之间')
        return false;
      }
  }
</script>
</body>
</html>

测试

Python2023012102.png

处理表单文件

python

from flask import Flask
from flask import Flask, render_template, flash, redirect, url_for, session, request, logging
app = Flask(__name__)#创建一个该类的实例，第一个参数是应用模块或者包的名称

#允许的扩展名
ALLOWED_EXTENSIONS = set(['png', 'jpg', 'jpeg', 'gif'])

# 控制台
@app.route('/dashboard', methods=['GET', 'POST'])
def dashboard():
    return "欢迎光临"

#检验文件后缀名是否合法
def allowed_file(filename):
    return '.' in filename and \
           filename.rsplit('.', 1)[1] in ALLOWED_EXTENSIONS

# 用户登录
@app.route('/pic', methods=['GET', 'POST'])
def do_image():
    if "logged_in" in session:  # 如果已经登录，则直接跳转到控制台
        return redirect(url_for("dashboard"))

    if request.method == 'GET': # 如果展示表单
        return render_template('login.html')
    elif request.method == 'POST':#如果是提交表单
        # 从表单中获取字段
        username = request.form['username']
        file = request.files['file']
        if file and allowed_file(file.filename):
            return render_template('pic.html', info="图片后缀名无误！")       
        else:
            return render_template('pic.html', info="图片后缀名错误！") # 跳转到登录页，并提示错误信息



if __name__ == '__main__':#程序入口
    #app.run()#让应用运行在本地服务器上。
    app.secret_key='secret123'
    app.run(host='0.0.0.0',port="5006",debug="true") #允许任意网址访问本站

html模板

pic.html: 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    <div class="content">
  <h1 class="title-center">图片处理</h1>
  <div  style="color:red;">{{info}}</div>
  <form action="" method="POST" onsubmit="return checkLogin()" enctype="multipart/form-data">
    <div class="form-group">
      <label>用户名</label>
      <input type="text" name="username" class="form-control" value={{request.form.username}}>
    </div>
    <div class="form-group">
       <input type="file" name="file">
    </div>

    <button type="submit" class="btn btn-primary">提交</button>
  </form>
</div>

<script>
  function checkLogin(){
      var username = $("input[name='username']").val()
      var password = $("input[name='password']").val()
      // 检测用户名长度
      if ( username.length < 2  || username.length > 25){
        alert('用户名长度在2-25个字符之间')
        return false;
      }
      // 检测密码长度
      if ( username.length < 2  || username.length > 25){
        alert('密码长度在6-20个字符之间')
        return false;
      }
  }
</script>
</body>
</html>

测试

Python2023012103.png

保存上传文件

python

from flask import Flask
from flask import Flask, render_template, flash, redirect, url_for, session, request, logging
from werkzeug.utils import secure_filename
import os 
app = Flask(__name__)#创建一个该类的实例，第一个参数是应用模块或者包的名称
app.config['UPLOAD_FOLDER'] = "upload_files/"
app.config['MAX_CONTENT_LENGTH'] = 16 * 1024 * 1024

#允许的扩展名
ALLOWED_EXTENSIONS = set(['png', 'jpg', 'jpeg', 'gif'])

# 控制台
@app.route('/dashboard', methods=['GET', 'POST'])
def dashboard():
    return "欢迎光临"

#检验文件后缀名是否合法
def allowed_file(filename):
    return '.' in filename and \
           filename.rsplit('.', 1)[1] in ALLOWED_EXTENSIONS

# 用户登录
@app.route('/pic', methods=['GET', 'POST'])
def do_image():
    if "logged_in" in session:  # 如果已经登录，则直接跳转到控制台
        return redirect(url_for("dashboard"))

    if request.method == 'GET': # 如果展示表单
        return render_template('login.html')
    elif request.method == 'POST':#如果是提交表单
        # 从表单中获取字段
        username = request.form['username']
        file = request.files['file']
        if file and allowed_file(file.filename):
            filename = secure_filename(file.filename)#导入Werkzeug提供的secure_filename()函数来检查文件名
            file.save(os.path.join(app.config['UPLOAD_FOLDER'], filename))
            return render_template('pic.html', info="上传成功！")       
        else:
            return render_template('pic.html', info="图片后缀名错误！") # 跳转到登录页，并提示错误信息



if __name__ == '__main__':#程序入口
    #app.run()#让应用运行在本地服务器上。
    app.secret_key='secret123'
    app.run(host='0.0.0.0',port="5006",debug="true") #允许任意网址访问本站

html代码

不变

测试

Python2023012104.png

Python2023012105.png

取自“http://www.openbrains.net/mediawiki/index.php?title=Python_Flask：表单&oldid=32416”