Flask框架

Flask是一个比较轻量级的web框架，可以通过第三方扩展来增加功能。

如下图所示，客户端将请求发送给后端，后端进行处理之后响应。

 

 

创建flask框架用pycharm可以直接创建（社区版不行，可以直接复制过来），其中HTML一定要放在templates里面，如果放在其他文件夹里的话就不会被读取到就会频繁的报错。（如果导包的时候提示没有安装flask，那么就用pip安装即可，pip可解万物）

 

接下来我们开始正式搞一搞flask吧

1、按照惯例，从hello，world开始吧，直接上代码吧

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

@app.route('/')
#这里是用来写path的，如果“/login”那么在端口后+/login就可以访问了
def hello_world():
    return "hello world"

if __name__ == '__main__':
    app.run(debug = True)
#debug之后就不用一直重启服务了，只要刷新即可

在浏览器中打开之后返回的值就是这样的

 

 

 2、和前端页面交互一下吧，把前端写的页面展示出来

@app.route('/')
def show_html():
    return render_template("1.html")
#这一步是返回1.html这个文件

 展示出来的是这样的

3、后端如何传值给前端

#先看看后端

@app.route('/')
def show_html():
    s = "这是后端传过来的值"
    return render_template("1.html",s = s)
#后端传值的时候只需要定义好参数，然后将参数跟在文件后面在定义个变量名就可以


#再看看前端
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <p>{{s}}</p>
    #前端引用的时候用{{}}来表示接收后端传来的值
</body>
</html>

执行之后展示出来是这个样子的

 

4、前后端交互（以前端提交表单+后端对状态和返回字段给前端，前端判断展示为例子）

#后端代码
@app.route('/login_yanling',methods=['GET','POST'])
#浏览器发起的默认为get请求，但是表单提交的时候是post请求，定义请求方法用：methods=['GET','POST']，这个表示两个都支持
def login_yanling():
    if request.method == "POST":
        username = request.form.get("username")
        pwd = request.form.get("password")
        if username == "yanling" and pwd == "123":
            message = "succ"
            return render_template("loginYanling.html",message = message)
        else:
            message = "fail"
            return render_template("loginYanling.html",message = message)
    else:
        message = "weidenglu"
        return render_template("loginYanling.html",message = message)
#以上的判断为：如果是未登录（主要用请求的方式判定，提交的方式为POST则认为是提交表单），返回weidenglu，登录失败返回fail，登录成功返回succ

#前端代码
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>登录</title>
</head>
<body>
    {% if message == "weidenglu" %}
        <p>未登录状态，请登录</p>
            <form action="login_yanling" method='POST'>
          用户名：<input type="text" name="username"><br><br>
            密码：<input type="password" name="password"><br><br>
            <input type="submit" name="登录" value="提交按钮">
        </form>
    {% endif %}
    {% if message == "succ" %}
        <p>登录成功</p>
    {% endif %}
    {% if message == "fail" %}
        <p>登录失败，请重新登录</p>
                <form action="login_yanling" method='POST'>
              用户名：<input type="text" name="username"><br><br>
                密码：<input type="password" name="password"><br><br>
                <input type="submit" name="登录" value="提交按钮">
            </form>
    {% endif %}

#在HTML中写if语句的时候用{%if%}开头{%endif%}结束；如果后端返回的是weidenglu则返回未登录+登录框，如果是fail则返回登陆失败请重新登录+登录框，如果是succ，直接返回登录成功
</body>
</html>

页面展示如下：

 

 

 

posted @ 2020-09-01 19:34  玲玲子爱学习  阅读(305)  评论(0)    收藏  举报