前言(碎碎念)
request的用法有很多呢,比如form、args、data、json、files、values啥的。
本文主要讲如何利用flask(后端)的request.post获取前端中form表单(即把前端数据传到后端),虽说request.get也能达到同样效果,但是一般情况post用的最多,所以本文主要探究post的方法啦
唠唠题外话
自这篇文章发布,也算是将近3个月没写技术类的文章了
哎,毕竟这东西费时费力:写文章并不像写代码一样,要必须把代码每一行的原理搞明白、讲出来;给文章的案例代码还经常报错…折腾着半天就过去了……
所以呢,这个网站以后还是以写生活随笔为主,计算机、编程类的文章嘛…就随缘吧(半年更www)
哦对了,我看网上教程我大多都看不懂,研究了半天,所以本文是根据我的理解而来的。我敢说本文是绝对的傻瓜式、胎教级的,就连幼儿园小朋友都会一目了然的!(自信)
准备
关于flask模块建站嘛,我去年写过一篇文章,里边提及安装flask环境和基础用法、搭建flask框架啥的,所以本文就不过多赘述了。对flask不了解的最好去看看哦
用flask框架搭建一个测试网站 – 阿草Mimosa的小屋 (loneapex.cn)
前端
我随便写了一个框架:
# 懒得自己写注释了,所以让copilot加了注释
# test.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>-</title>
</head>
<body>
<!-- 创建一个表单,当提交时,会向'/done'路由发送POST请求 -->
<form method="post" action="/done">
<!-- 创建一个下拉菜单供用户选择 -->
<label>随便选选</label>
<select name="name">
<option value="我是人">我是人</option>
<option value="我是人嘛?">我是人嘛?</option>
<option value="我不是人">我不是人</option>
<option value="我不是人嘛?">我不是人嘛?</option>
</select>
<!-- 创建一个文本输入框供用户输入 -->
<label>随便写写</label>
<input type="text" name="name2">
<!-- 创建一个提交按钮 -->
<input type="submit" value="提交">
</form>
</body>
</html>
要注意的是,我们要把<form>
表单中的数据传给python,但是form中的标签不限于input
,也可以是select、textarea、checkbox
等,但都在后端通过name属性获取其中的值。
form标签挺神奇的,其中method="post"
代表使用post
请求,反之get就是get呗
form标签中尤其注意action
属性,它指定将填写的表单数据发送到哪个页面。(必须与服务器的路由路径相匹配才能正确发送数据。)
比如我action
的路径是/done
,则说明把数据提交到/done路径中(或者说路由)了,所以在后端只需在/done路由获取form信息即可。
所以——
后端
# 依旧是copilot写的注释
# app.py
# 导入Flask模块和其他必需的模块
from flask import Flask, render_template, request, redirect
# 创建Flask应用实例
app = Flask(__name__)
# 定义路由为'/'的视图函数,这是访问网站的主页
@app.route('/')
def index():
# 渲染并返回'test.html'模板
return render_template('test.html')
# 定义路由为'/done'的视图函数,只接受POST方法
@app.route('/done', methods=['POST'])
def done():
# 从表单中获取'name'和'name2'字段的数据
name = request.form['name']
name2 = request.form['name2']
# 在服务器控制台打印这些数据
print(name, name2)
# 重定向回主页
return redirect("/")
# 确保这是主脚本,并在调试模式下运行应用
if __name__ == '__main__':
app.run(debug=True)
效果:
get与post请求的区别
我问了一下copilot:
如果您在HTML表单中使用<form method="get" action="/done">
,这将改变数据提交的方式。具体来说:
- 当使用
GET
方法时,表单数据会附加到URL中,形成一个查询字符串。例如,如果用户在表单中输入了数据,提交后,浏览器会向服务器发送一个请求,URL可能看起来像这样:/done?name=用户输入的值&name2=另一个用户输入的值
。 GET
方法通常用于请求数据,而不是提交数据。它适用于不涉及敏感信息的搜索或过滤操作。- 使用
GET
方法时,由于数据显示在URL中,因此用户可以将URL保存为书签或分享给他人。
总的来说,GET
方法适用于那些不需要保密的数据提交,而POST
方法则更适合需要保护数据不被轻易访问的情况。
不过嘛,如果你前端改了get,后端methods也得改成GET
后端给前端传参
flask
的render_template
可以带参数传给前端,前端用{{}}
接住就行了。
比如我想把我选择的内容传给后端,后端再传给前端,则可以这样:
在done
路由那儿,因为已经获取到了前端name
和name1
了,再通过render_template
传参即可
(redirect重定向好像不支持传参,所以只能放弃redirect
而改为render_template了
)
@app.route('/done', methods=['POST'])
def done():
# 从表单中获取'name'和'name2'字段的数据
name = request.form['name']
name2 = request.form['name2']
# 在服务器控制台打印这些数据
print(name, name2)
# 把之前的重定向砍掉了
# 没错,在最后加几个参数即可,a_name是给前端的变量名,name是后端的
return render_template('test.html', a_name=name, a_name2=name2)
然后前端在form标签之外加上:
<p>君の选择:{{a_name}}{{ a_name2 }}</p>
(a_name、a_name2即为后端传递过来的内容,类似变量)
over
所以,这篇文章就这点东西了
不过嘛,让我来说本篇的实际应用的话,我觉得用别人的api某些功能搞个网站,或者网页需要服务器处理一些数据时,应该能用上吧?
下篇文章打算讲讲mongoDB数据库,如何?