Flask小项目教程(含MySQL与前端部分)

CONTENTS

    • [1. 环境配置](#1. 环境配置)
    • [2. 快速搭建Flask应用程序](#2. 快速搭建Flask应用程序)

1. 环境配置

首先我们在项目的根目录下创建一个 Python 虚拟环境,打开命令行输入以下指令:

shell 复制代码
python -m venv venv

启动虚拟环境:

shell 复制代码
.\venv\Scripts\Activate.ps1

如果遇到报错:.\venv\Scripts\Activate.ps1 : File ...\venv\Scripts\Activate.ps1 cannot be loaded because running scripts is disabled on this system.,说明可能是系统禁止运行脚本,打开 PowerShell 查看一下系统当前的执行策略:

shell 复制代码
get-executionpolicy

如果为 Restricted 说明此系统不载入任何配置文件,不运行任何脚本。我们需要修改一下执行策略,以管理员身份打开 PowerShell,使用以下指令修改执行策略:

shell 复制代码
Set-ExecutionPolicy Unrestricted  # 设置全局的执行策略
Set-ExecutionPolicy -Scope CurrentUser Unrestricted  # 设置当前用户的执行策略

接下来我们安装 Flask:

shell 复制代码
pip install flask

2. 快速搭建Flask应用程序

我们先看一下如何创建 URL 与函数的对应关系:

py 复制代码
from flask import Flask

app = Flask(__name__)  # 实例化Flask类的对象

@app.route("/index")
def index():
    return "<h1>Hello World!</h1>"

if __name__ == "__main__":
    app.run()

其中的 @app.route 作用是创建了网址 /indexindex 函数的对应关系。现在我们运行程序,能看到终端的输出: * Running on http://127.0.0.1:5000,然后我们访问 http://127.0.0.1:5000/index 即可看到 Hello World!

注意我们返回的字符串中有 <h1></h1> 标签,这是 HTML 标签,整个项目的逻辑是用户(浏览器)访问 URL 时向 Web 应用(此处就是 Flask)发送请求,然后 Web 应用向浏览器返回一个字符串,浏览器是具备解析 <h1> 这类 HTML 标签的能力的。前端部分的学习可以在 Web 专栏中找到。

Tips:PyCharm 输入 main 即可自动补全出 if __name__ == "__main__":,VS Code 则需要进行配置,点击左下角的齿轮,选择 User Snippets(用户代码片段),然后在弹出的下拉选框中选择 python,这时会出来一个配置文件 python.json,然后向该文件中添加 "Print to console" 项,修改后如下:

json 复制代码
{
	"Print to console": {
		"prefix": "main",
		"body": [
			"if __name__ == '__main__':",
			"    ${1:pass}",
			"",
		],
		"description": "python--main"
	}
}

Flask 框架为了让我们写 HTML 标签更方便,支持将这些内容写到一个单独的文件中,render_template 函数可以渲染 HTML 文件,默认是从项目根目录下的 templates 目录中开始寻找文件,我们创建 templates 目录并创建一个 index.html 如下:

html 复制代码
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Index</title>
</head>
<body>
    <h1>Hello World!</h1>
</body>
</html>

现在就可以将之前的字符串改为渲染一个 HTML 文件了:

py 复制代码
from flask import Flask, render_template

app = Flask(__name__)  # 实例化Flask类的对象

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

if __name__ == "__main__":
    app.run()

假设我们在页面中需要引入一张本地的图片,在 Flask 中要求我们需要将图片这类静态文件(还有视频、音频、CSS、JS 等)放在项目根目录中的 static 目录下,假设我们有一张图片放在 static/image 目录下,那么就可以直接用相对路径调用该图片了:

html 复制代码
<!DOCTYPE html>
<html lang="en">
...
<body>
    <h1>Hello World!</h1>
    <img src="/static/image/background.jpg" />
</body>
</html>
相关推荐
睡睡怪4 分钟前
Mysql入门
数据库·mysql·oracle
小杨40414 分钟前
springboot框架项目实践应用十五(扩展sentinel区分来源)
spring boot·后端·spring cloud
二狗哈26 分钟前
go游戏后端开发24:写完赢三张游戏
python·游戏·golang
明月看潮生30 分钟前
青少年编程与数学 02-016 Python数据结构与算法 03课题、数组与链表
数据结构·python·青少年编程·编程与数学
FirstMrRight36 分钟前
自动挡线程池OOM最佳实践
java·后端
OpenTiny社区43 分钟前
TinyPro 中后台管理系统使用指南——让页面搭建变得如此简单!
前端·vue.js·开源
程序员清风1 小时前
Redis Pipeline 和 MGET,如果报错了,他们的异常机制是什么样的?
java·后端·面试
我有一只臭臭1 小时前
webpack配置解析
前端·webpack