当前位置：首页 > news >正文

Python 之 Flask 入门学习

news 来源：原创 2025/5/15 11:09:58

安装 Flask

在开始使用 Flask 之前，需要先安装它。可以通过 pip 命令来安装 Flask：

pip install Flask

创建第一个 Flask 应用

创建一个简单的 Flask 应用，只需要几行代码。以下是一个最基本的 Flask 应用示例：

from flask import Flaskapp = Flask(__name__)@app.route('/')
def hello_world():return 'Hello, World!'if __name__ == '__main__':app.run()

将上述代码保存为 app.py，然后在终端中运行：

python app.py

运行后，访问 http://127.0.0.1:5000/，将会看到页面上显示 “Hello, World!”。

路由和视图函数

在 Flask 中，路由是通过 @app.route() 装饰器来定义的。路由决定了当用户访问某个 URL 时，应该执行哪个视图函数。例如：

@app.route('/about')
def about():return 'This is the about page.'

访问 http://127.0.0.1:5000/about 将会显示 “This is the about page.”。

模板渲染

Flask 使用 Jinja2 模板引擎来渲染 HTML 页面。可以通过 render_template 函数来渲染模板。首先，在项目目录下创建一个 templates 文件夹，并在其中创建一个 index.html 文件：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Home</title>
</head>
<body><h1>{{ message }}</h1>
</body>
</html>

然后在 Flask 应用中使用 render_template 来渲染这个模板：

from flask import Flask, render_templateapp = Flask(__name__)@app.route('/')
def home():return render_template('index.html', message='Hello, Flask!')if __name__ == '__main__':app.run()

访问 http://127.0.0.1:5000/ 将会看到页面上显示 “Hello, Flask!”。

处理表单数据

Flask 可以轻松处理表单数据。以下是一个简单的表单处理示例：

from flask import Flask, request, render_templateapp = Flask(__name__)@app.route('/form', methods=['GET', 'POST'])
def form():if request.method == 'POST':name = request.form['name']return f'Hello, {name}!'return render_template('form.html')if __name__ == '__main__':app.run()

在 templates 文件夹中创建一个 form.html 文件：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Form</title>
</head>
<body><form method="POST"><label for="name">Name:</label><input type="text" id="name" name="name"><button type="submit">Submit</button></form>
</body>
</html>

访问 http://127.0.0.1:5000/form，填写表单并提交后，将会看到页面上显示 “Hello, [你输入的名字]!”。

静态文件

Flask 允许在 static 文件夹中存放静态文件，如 CSS、JavaScript 和图片。可以通过 url_for 函数来引用这些静态文件。例如：

<link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">

部署 Flask 应用

Flask 应用可以通过多种方式部署，例如使用 Gunicorn 或 uWSGI。以下是一个使用 Gunicorn 部署的示例：

gunicorn app:app

这将启动一个生产环境的 Flask 应用。

通过以上步骤，可以快速入门 Flask 并开始构建自己的 Web 应用。

实践项目

项目结构如下图
在这里插入图片描述
web_flask.py 源码

from flask import Flask, request, render_template, send_from_directory
import os, json# 创建实例,设置静态资源目录，设置默认模板目录
app = Flask(__name__ ,static_folder='static' ,template_folder='templates')# 添加额外的静态目录和对应的URL路径，访问静态资源http://127.0.0.1:5100/upload/test.txt
@app.route('/upload/<path:filename>')
def publicFiles(filename):return send_from_directory('upload', filename)# 访问首页http://127.0.0.1:5100
@app.route('/')
def myIndex():# return "我是首页"return render_template('index.html')# 获取GET请求参数http://127.0.0.1:5100/welcome?userName=我的名字 
@app.route('/welcome', methods=["GET"])
def getparam():userName = request.values.get("userName")return render_template('hello.html', name=userName)# 接收上传文件
@app.route("/upfile", methods=["POST", "GET"])
def upfile():file = request.files.get("filename")if file is None: #表示没有发送文件return {'message': "文件上传失败"}file_name = file.filename.replace(" ","") #删除空格file.save(os.path.dirname(__file__)+'/upload/'+ file_name)  #保存文件str = f"获取上传文件的名称为：{file_name}"print(str)res =  {'code': 200,'messsge': "文件上传成功",'fileName': file_name,'url': 'http://127.0.0.1:5100/upload/' + file_name}restr = json.dumps(res, ensure_ascii=False) #防止中文显示为Unicode编码return restrif __name__ == '__main__':app.run(host='127.0.0.1', port=5100)

访问首页的效果图

在这里插入图片描述

index.html 模板源码

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>上传文件</title></head><body><form action="http://127.0.0.1:5100/upfile" method="post" enctype="multipart/form-data"><input type="file" name="filename" /><br><input type="submit" value="上传" /><input type="reset" value="取消" /></form><!-- <script>var form = document.getElementsByTagName('form')[0];form.onsubmit = function(){var xhr = new XMLHttpRequest();xhr.open('post','http://127.0.0.1:5100/upfile');xhr.onreadystatechange = function(){if(xhr.readyState == 4){if(xhr.status == 200){}}}}</script> --></body>
</html>

展示get请求参数

hello.html 模板源码

<!DOCTYPE html>
<html>
<head><title>Hello</title><link href="../static/favicon.ico" rel="icon">
</head>
<body><h1>Hello, {{ name }}!</h1>
</body>
</html>