基于flask的在线笔记共享管理系统【7】（flask框架--浏览器和服务器程序交互基本方法）

最新推荐文章于 2024-04-20 10:31:46 发布

DreamBoy@

最新推荐文章于 2024-04-20 10:31:46 发布

阅读量821

点赞数 1

分类专栏：【python项目flask微框架】（在线的笔记记录系统）文章标签： python web flask templates

本文链接：https://blog.csdn.net/siper12138/article/details/116118248

版权

【python项目flask微框架】（在线的笔记记录系统）专栏收录该内容

10 篇文章 26 订阅

订阅专栏

基于flask的在线笔记共享管理系统【7】

上一篇文章我们主要介绍了flask的简单的编写方式，这里向大家再详细向大家介绍一些浏览器和服务器程序交互的内容。系列文章目录：基于flask的在线笔记共享管理系统
在这里插入图片描述

补充知识

上一篇文章简单简绍了一下flask的基本模式，很多同学可能对于其响应机制不太理解，这里以下面的代码为例详细说明一下。（这就是上一篇里显示图片那个代码）

from flask import Flask, render_template
app = Flask(__name__)
@app.route('/')
def index():
    return render_template('home.html')
# 渲染模板
if __name__ == '__main__':
    app.run()

 1 首先运行Python服务程序（运行编好的代码）
在这里插入图片描述

 2.在浏览器输入URL访问某个资源（就是设置的路径http://127.0.0.1:5000/）
 3.Flask接受用户请求分析URL
 4.为这个URL找到对应的处理函数

@app.route('/')
def index():
    return render_template('home.html')

 5.执行函数并生成响应，返回给浏览器
 6.浏览器接受并解析响应，将信息显示在浏览器页面中
在这里插入图片描述
这里还要说明一下，这里可以多个URL对应同一个函数。如下。@app.route(’/’) @app.route(’/home’)俩个装饰器对应同一个函数。这样在浏览器中输入不同的URL返回结果是一样的。

from flask import Flask, render_template
app = Flask(__name__)
@app.route('/')
@app.route('/home')
def index():
    return render_template('home.html')
# 渲染模板
if __name__ == '__main__':
    app.run()

在浏览器输入：http://127.0.0.1:5000或http://127.0.0.1:5000/home，结果一样
在这里插入图片描述

浏览器和服务器程序交互

首先我们需要了解一下HTTP协议常用请求：

GET：从服务器程序获取信息
POST：通常用作向服务器程序发送数据，一般用表单实现
POST请求可能会导致新的资源的建立和/或已有资源的修改

浏览器和服务器程序交互可以通过get和post方法实现。在装饰器上可以加上http方法，常用的是get和post方法，缺省的是get方法。

@app.route("/")#与下面等价
@app.route("/",methods=[“get”])

如果需要俩个方法。则这样写。

@app.route("/",methods=[“get”,”post”])

下面我们通过一个使用浏览器中的表单实现一个加法的简单运算的例子，来理解浏览器的服务器程序的交互。
首先一起来看一下主要代码。
【app.py】

from flask import Flask, request
import flask
app = Flask(__name__)
@app.route('/',methods=['GET', 'POST'])
@app.route('/add',methods=['GET', 'POST'])
def add():
    if flask.request.method == 'GET':
        return flask. render_template('index.html')
    else:
        n1 = int(request.form['n1'])
        n2 = int(request.form['n2'])
        s = n1 + n2
        return flask.render_template('result.html',n1=n1,n2=n2,n3=s)
if __name__ == '__main__':
    app.run()

request处理请求的机制

其中一个我们没有见过的东西，request是flask中处理请求的机制。本程序涉及下面俩个属性

request.form['n1']  #从前端的表单获取数据参数为表单的name
flask.request.method == 'GET'    #获取前端的请求方式 'GET'或 'POST'

接下来看一下输入界面的前端代码【index.html】

<!DOCTYPE html>
<html>
<head>
    <title>Add</title>
    <meta charset="UTF-8">
    <meta name="description" content="" />
    <meta name="keywords" content="" />
</head>
<body>
        <h2>输入两个数求和</h2>
        <form method='post' action='/add'>
         <table>
           <td><input type='text' name='n1'/></td><td>+</td><td><input type='text' name='n2'/></td>
         </table>
        <button name="sum" type="submit" value="sum">计算</button>
 
</body>
</html>

然后看一下结果页面的代码【result.html】

<!DOCTYPE html>
<html>
    <body>
      <h2>输入两个数求和</h2>
      <table>
        <tr><td> {{n1}}</td>
        <td>+</td><td> {{n2}}</td>
        <td>=</td><td> {{n3}}</td></tr>
      </table>
    </body>
</html>

这里关于HTML语言方面的内容不做过多的讲解。但是要补充一个知识点,大家可能也发现了，上面的代码中中有一个{{n1}},关于{{}}，这是Jinja2 模版中的变量代码块，中间的内容是一个变量，由后端代码传递。{{n1}}中的n1是flask.render_template(‘result.html’,n1=n1,n2=n2,n3=s) 中n1=n1前面的n1;
【result.html】

{{n1}}

【app.py】

return flask.render_template('result.html',n1=n1,n2=n2,n3=s)
#等号左边是前端HTML中的变量，等号右边是后端代码中的变量

除了{{}}之外，Jinja2 模版中还有{%%} 定义的控制代码块，使用 {# #} 进行注释，这里不进行详细叙述，详细叙述下一篇文章讲解。
下面我们看一看这段程序的运行结果。
【输入界面】程序默认进行get操作，代码中if成立渲染输入界面：

if flask.request.method == 'GET':
        return flask. render_template('index.html')

在这里插入图片描述

【输入数据】
在这里插入图片描述
【点击计算跳转至结果页面】点击计算后方式被修改为post，触发函数进入else，进行计算

 else:
        n1 = int(request.form['n1'])
        n2 = int(request.form['n2'])
        s = n1 + n2
        return flask.render_template('result.html',n1=n1,n2=n2,n3=s)

在这里插入图片描述
综上，就是实现浏览器和服务器程序交互的基本方法。

DreamBoy@

关注

1
点赞
踩
5

收藏

觉得还不错? 一键收藏
打赏
0
评论
基于flask的在线笔记共享管理系统【7】（flask框架--浏览器和服务器程序交互基本方法）

基于flask的在线笔记共享管理系统【7】上一篇文章我们主要介绍了flask的简单的编写方式，这里向大家再详细向大家介绍一些浏览器和服务器程序交互的内容。系列文章目录：基于flask的在线笔记共享管理系统补充知识上一篇文章简单简绍了一下flask的基本模式，很多同学可能对于其响应机制不太理解，这里以下面的代码为例详细说明一下。（这就是上一篇里显示图片那个代码）from flask import Flask, render_templateapp = Flask(__name__)@app.ro
复制链接

扫一扫