流程控制
主要包含两个：
- if / elif /else / endif
- for / else / endfor
if语句
Jinja2 语法中的if语句跟 Python 中的 if 语句相似,后面的布尔值或返回布尔值的表达式将决定代码中的哪个流程会被执行.
用 {%%} 定义的控制代码块，可以实现一些语言层次的功能，比如循环或者if语句
视图代码：
import random
from flask import Flask, render_template
app = Flask(__name__, template_folder="templates")
@app.route("/")
def index():
data = random.randint(1,100)
return render_template("index6.html", **locals())
@app.route("/user/<int:uid>")
def user(uid):
print(uid)
return f"uid={uid}"
if __name__ == '__main__':
app.run(host="0.0.0.0", port=5000, debug=True)
index.html，模板代码：
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
{% if data < 60 %}
<p>本次生成的数字不及格！</p>
{% else %}
<p>本次生成的数字及格了！</p>
{% endif %}
{% if data < 60 %}
<p>本次生成的数字不及格！</p>
{% elif data <80 %}
<p>本次生成的数字一般般，不算高！</p>
{% else %}
<p>本次生成的数字超过80，非常好！</p>
{% endif %}
</body>
</html>
循环语句
- 我们可以在 Jinja2 中使用循环来迭代任何列表或者生成器函数
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
table, td,th{
border: 1px solid red;
border-collapse: collapse;
}
table{
width: 800px;
}
td,th{
padding: 4px;
}
.last{
background: orange;
}
</style>
</head>
<body>
<table>
<tr>
<th>序号</th>
<th>ID</th>
<th>name</th>
<th>age</th>
</tr>
{% for user in user_list %}
{% if loop.last %}
<tr class="last">
{% else %}
<tr>
{% endif %}
{# <th>{{ loop.index }}</th>#}
{# <th>{{ loop.index0 }}</th>#}
{# <th>{{ loop.revindex0 }}</th>#}
<th>{{ loop.revindex }}</th>
<th>{{ user.id }}</th>
<th>{{ user.name }}</th>
<th>{{ user.age }}</th>
</tr>
{% endfor %}
</table>
</body>
</html>
- 循环和if语句可以组合使用，以模拟 Python 循环中的 continue 功能，下面这个循环将只会渲染user.id为偶数的那些user：
<table border="1" width="1200">
<tr>
<th width="200">序号[从小到大，从0开始]</th>
<th width="200">序号[从小到大，从1开始]</th>
<th width="200">序号[从大到小，到0结束]</th>
<th width="200">序号[从大到小，到1结束]</th>
<th>ID</th>
<th>name</th>
<th>age</th>
</tr>
{% for user in user_list if user.id%2==0 %}
<tr>
<td>{{ loop.index0 }}</td>
<td>{{ loop.index }}</td>
<td>{{ loop.revindex0 }}</td>
<td>{{ loop.revindex }}</td>
<td>{{ user.id }}</td>
<td>{{ user.name }}</td>
<td>{{ user.age }}</td>
</tr>
{% endfor %}
</table>
- 在一个 for 循环块中你可以访问这些特殊的变量:
| 变量 | 描述 |
|---|---|
| loop.index | 当前循环迭代的次数（从 1 开始） |
| loop.index0 | 当前循环迭代的次数（从 0 开始） |
| loop.revindex | 到循环结束需要迭代的次数（从 1 开始） |
| loop.revindex0 | 到循环结束需要迭代的次数（从 0 开始） |
| loop.first | 如果是第一次迭代，为 True 。 |
| loop.last | 如果是最后一次迭代，为 True 。 |
| loop.length | 序列中的项目数。 |
| loop.cycle | 在一串序列间期取值的辅助函数。见下面示例程序。 |
- 在循环内部,你可以使用一个叫做loop的特殊变量来获得关于for循环的一些信息
- 比如：要是我们想知道当前被迭代的元素序号，并模拟Python中的enumerate函数做的事情，则可以使用loop变量的index属性,例如:
<ul>
{% for item in data_list %}
<li>{{ loop.index0 }}，item={{ item }}</li>
{% endfor %}
</ul>
- 会输出这样的结果
0，item=a
1，item=b
2，item=c
- loop.cycle函数会在每次循环的时候,返回其参数中的下一个元素,可以拿上面的例子来说明:
<ul>
{% for item in data_list %}
<li>{{ loop.cycle("男","女")}}，item={{ item }}</li>
{% endfor %}
</ul>
- 会输出这样的结果：
男，item=a
女，item=b
男，item=c
课堂代码
视图代码：
import click
from flask import Flask,render_template,g
# flask开发小型的项目，直接在当前flask应用配置即可。手动创建模板目录。
# flask开发中大型项目，直接在当前flask的每一个子应用(蓝图)下构建目录。
app = Flask(import_name=__name__, template_folder="templates")
# 加载配置
app.config.from_object(Config)
@app.route("/")
def index():
title = "站点标题"
data_list = ["a","b","c"]
data_dict = {
"name": "xiaoming",
"id": 100,
}
user_list = [
{"id":2, "name": "xiaoming", "age":15},
{"id":3, "name": "xiaoming", "age":16},
{"id":4, "name": "xiaoming", "age":17},
]
g.name = "来自视图"
return render_template("index.html", **locals())
if __name__ == '__main__':
app.run(host="0.0.0.0", port=5000, debug=True)
index.html，模板代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>{{title}}</title>
</head>
<body>
{# <h1>{{title}}</h1>
<p>{{ data_list }}</p>
<p>{{ data_list.1 }}</p>
<p>{{ data_list | first }}</p>
<p>{{ data_list | last }}</p>
<p>{{ data_dict }}</p>
<p>{{ data_dict.name }}</p>
#}{# <p>{{ data_list.-1 }}</p>#}{#
<p>{{ user_list.0 }}</p>
<p>{{ user_list.0.name }}</p>
#}
{# <p>{{ data_list[0] }}</p>#}
{# <p>{{ data_list[-1] }}</p>#}
{# <p>{{ data_dict['name'] }}</p>#}
{# <p>{{ config }}</p>#}
{# <p>{{ config.ENV }}</p>#}
{# <p>{{ request }}</p>#}
{# <p>获取地址栏参数：id={{ request.args.id }}</p>#}
{# <p>{{ session }}</p>#}
{# <p>{{ session.new }}</p>#}
{# <p>{{ g.name }}</p>#}
{# <p>{{ url_for("index",id=1) }}</p>#}
{% if "a" in data_list %}
<p>{{ data_list }}包含a字符</p>
{% endif %}
{% if "A" in data_list %}
<p>{{ data_list }}包含A字符</p>
{% else %}
<p>{{ data_list }}不包含A字符</p>
{% endif %}
<table border="1" width="1200">
<tr>
<th width="200">序号[从小到大，从0开始]</th>
<th width="200">序号[从小到大，从1开始]</th>
<th width="200">序号[从大到小，到0结束]</th>
<th width="200">序号[从大到小，到1结束]</th>
<th>ID</th>
<th>name</th>
<th>age</th>
</tr>
{% for user in user_list if user.id%2==0 %}
<tr>
<td>{{ loop.index0 }}</td>
<td>{{ loop.index }}</td>
<td>{{ loop.revindex0 }}</td>
<td>{{ loop.revindex }}</td>
<td>{{ user.id }}</td>
<td>{{ user.name }}</td>
<td>{{ user.age }}</td>
</tr>
{% endfor %}
</table>
<ul>
{% for item in data_list %}
<li>{{ loop.index0 }}，item={{ item }}</li>
{% endfor %}
</ul>
<ul>
{% for item in data_list %}
<li>{{ loop.cycle("男","女")}}，item={{ item }}</li>
{% endfor %}
</ul>
</body>
</html>
过滤器
django中的模板引擎里面曾经使用过滤器，在flask中也有过滤器，并且也可以被用在 if 语句或者for语句中:
视图代码：
import random
from flask import Flask, render_template
app = Flask(__name__, template_folder="templates")
@app.route("/")
def index():
book_list = [
{"id":1, "price": 78.50, "title":"javascript入门", "cover": "<img src='/static/images/course.png'>"},
{"id":2, "price": 78.5, "title":"python入门", "cover": "<img src='/static/images/course.png'>"},
{"id":3, "price": 78.6666, "title":"django web项目实战", "cover": "<img src='/static/images/course.png'>"}
]
return render_template("index8.html", **locals())
if __name__ == '__main__':
app.run(host="0.0.0.0", port=5000, debug=True)
index8.html，模板代码：
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
table, td,th{
border: 1px solid red;
border-collapse: collapse;
}
table{
width: 800px;
}
td,th{
padding: 4px;
}
img{
width: 100px;
}
</style>
</head>
<body>
<table>
<tr>
<th>ID</th>
<th>title</th>
<th>price</th>
<th>cover</th>
</tr>
{% for book in book_list %}
<tr>
<th>{{ book.id }}</th>
<th>{{ book.title | title }}</th>
<th>{{ book.price }}</th>
<th>{{ book.cover | safe }}</th>
</tr>
{% endfor %}
</table>
</body>
</html>
flask中， 过滤器的本质就是函数。有时候我们不仅仅只是需要输出变量的值，我们还需要修改变量的显示，甚至格式化、运算等等，而在模板中是不能直接调用 Python 的方法，那么这就用到了过滤器。
使用方式：
- 过滤器的使用方式为：变量名 | 过滤器 | 。。。。。
{{variable | filter_name(args1,args2,....)}}
- 如果没有任何参数传给过滤器,则可以把括号省略掉
{{variable | title }}
- 如：
title过滤器的作用：把变量的值的首字母转换为大写，其他字母转换为小写
在 jinja2 中，过滤器是可以支持链式调用的，示例如下：
{{ "hello world" | reverse | upper }}
常见的内建过滤器
源代码：from jinja2.filters import FILTERS
字符串操作
- safe：禁用实体字符的转义
{{ '<h1>hello</h1>' | safe }}
- lower：把值转成小写
<p>{{ 'HELLO' | lower }}</p>
- upper：把值转成大写
<p>{{ 'hello' | upper }}</p>
- reverse：字符串反转
<p>{{ 'olleh' | reverse }}</p>
- format：格式化输出
<p>{{ '%s = %d' | format('name',17) }}</p>
<p>{{ '%s = %d' % ('name', 17) }}</p>
-
striptags：渲染之前把值中所有的HTML标签都删掉
如果内容中，存在大小于号的情况，则不要使用这个过滤器，容易误删内容。
<p>{{ '<script>alert("hello")</script>' | striptags }}</p>
<p>{{ "如果x<y，z>x，那么x和z之间是否相等？" | striptags }}</p>
- truncate: 字符串截断
<p>{{ 'hello every one' | truncate(9)}}</p>
列表操作
- first：取第一个元素
<p>{{ [1,2,3,4,5,6] | first }}</p>
- last：取最后一个元素
<p>{{ [1,2,3,4,5,6] | last }}</p>
- length：获取列表长度
<p>{{ [1,2,3,4,5,6] | length }}</p>
<p>{{ [1,2,3,4,5,6] | count }}</p>
- sum：列表求和
<p>{{ [1,2,3,4,5,6] | sum }}</p>
- sort：列表排序
<p>{{ [6,2,3,1,5,4] | sort }}</p>
语句块过滤
{% filter upper %}
<p>abc</p>
<p>{{ ["a","c"] }}</p>
<p>{{ ["a","c"] }}</p>
<p>{{ ["a","c"] }}</p>
<p>{{ ["a","c"] }}</p>
{% endfilter %}
自定义过滤器
过滤器的本质是函数。当模板内置的过滤器不能满足项目需求，可以自定义过滤器。自定义过滤器有两种实现方式：
- 一种是通过Flask应用对象的 app.add_template_filter 方法进行注册
- 通过装饰器来实现自定义过滤器进行注册
注意：自定义的过滤器名称如果和内置的过滤器重名，会覆盖内置的过滤器。
需求：编写一个过滤器，保留2位小数
方式一
通过调用应用程序实例的 add_template_filter 方法实现自定义过滤器。该方法第一个参数是函数名，第二个参数是自定义的过滤器名称：
# 自定义过滤器
def do_fixed(data, length):
return f"%.{length}f" % data
# 注册过滤器到当前应用实例对象
app.add_template_filter(do_fixed, "fixed")
方式二
用装饰器来实现自定义过滤器。装饰器传入的参数是自定义的过滤器名称。
# 自定义过滤器，通过装饰器注册到app应用实例对象
@app.template_filter("fixed")
def do_fixed(data, length):
return f"%.{length}f" % data
- 主程序中创建和注册过滤器
from flask import Flask, render_template
app = Flask(__name__, template_folder="templates")
# 自定义过滤器，通过装饰器注册到app应用实例对象
@app.template_filter("fixed")
def do_fixed(data):
return f"{data:.2f}"
@app.route("/")
def index():
title = "网页标题"
book_list = [
{"id":1, "price": 78.50, "title":"javascript入门", "cover": "<img src='/static/images/course.png'>"},
{"id":2, "price": 78.5, "title":"python入门", "cover": "<img src='/static/images/course.png'>"},
{"id":3, "price": 78.6666, "title":"django web项目实战", "cover": "<img src='/static/images/course.png'>"}
]
return render_template("index9.html", **locals())
if __name__ == '__main__':
app.run(host="0.0.0.0", port=5000, debug=True)
- html9.html，调用过滤器，代码：
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
table, td,th{
border: 1px solid red;
border-collapse: collapse;
}
table{
width: 800px;
}
td,th{
padding: 4px;
}
img{
width: 100px;
}
</style>
</head>
<body>
<table>
<tr>
<th>ID</th>
<th>title</th>
<th>price</th>
<th>cover</th>
</tr>
{% for book in book_list %}
<tr>
<th>{{ book.id }}</th>
<th>{{ book.title | title }}</th>
<th>{{ book.price | fixed }}</th>
<th>{{ book.cover | safe }}</th>
</tr>
{% endfor %}
</table>
</body>
</html>
练习：给手机进行部分屏蔽 13112345678 —> 131****5678
from flask import Flask, render_template
app = Flask(__name__, template_folder="templates", static_folder="static")
# 配置
app.config.update({
"DEBUG": True
})
# 自定义过滤器
@app.template_filter("mobile")
def do_mobile(data, flag):
return data[:3] + str(flag) + data[-4:]
@app.route("/")
def index():
user_list = [
{"id":1,"name":"张三","mobile":"13112345678"},
{"id":2,"name":"张三","mobile":"13112345678"},
{"id":3,"name":"张三","mobile":"13112345678"},
{"id":4,"name":"张三","mobile":"13112345678"},
]
return render_template("index5.html", **locals())
if __name__ == '__main__':
app.run()
index2.html，模板代码：
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
table, td,th{
border: 1px solid red;
border-collapse: collapse;
}
table{
width: 800px;
}
td,th{
padding: 4px;
}
img{
width: 100px;
}
</style>
</head>
<body>
<table>
<tr>
<th>ID</th>
<th>name</th>
<th>mobile</th>
</tr>
{% for user in user_list %}
<tr>
<th>{{ user.id }}</th>
<th>{{ user.name }}</th>
<th>{{ user.mobile | mobile("****") }}</th>
</tr>
{% endfor %}
</table>
</body>
</html>
效果：
模板继承
在模板中，可能会遇到以下情况：
- 多个模板具有完全相同的顶部和底部内容
- 多个模板中具有相同的模板代码内容，但是内容中部分值不一样，弹窗
- 多个模板中具有完全相同的 html 代码块内容，侧边栏
像遇到这种情况，可以使用 JinJa2 模板中的 模板继承 来进行实现
模板继承是为了重用模板中的公共内容。一般Web开发中，继承主要使用在网站的顶部菜单、底部、弹窗。这些内容可以定义在父模板中，子模板直接继承，而不需要重复书写。
- block标签定义的可重写的内容范围
{% block 区块名称 %} {% endblock 区块名称 %}
{% block 区块名称 %} {% endblock %}
例如：顶部菜单
{% block menu %}{% endblock %}
- block相当于在父模板中挖个坑，当子模板继承父模板时，可以进行对应指定同名区块进行代码填充。
- 子模板使用 extends 标签声明继承自哪个父模板
- 父模板中定义的区块在子模板中被重新定义，在子模板中调用父模板的内容可以使用super()调用父模板声明的区块内容。
manage.py，视图代码：
from flask import Flask, render_template
app = Flask(__name__, template_folder="templates", static_folder="static")
# 配置
app.config.update({
"DEBUG": True
})
@app.route("/")
def index():
title = "我的首页"
return render_template("base.html", **locals())
@app.route("/list")
def list_page():
title = "商品列表"
content = "商品列表ng "
return render_template("list.html", **locals())
if __name__ == '__main__':
app.run()
父模板代码：
base.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>{{ title | default("默认标题") }}</title>
{% block css %}
{% endblock %}
</head>
<body>
<h1>头部公共内容-菜单-登录窗口</h1>
{% block main %}
<div>公共页面中间部分内容 - {{ title }}</div>
{% endblock main %}
<h1>脚部公共内容-版权信息，网点地图</h1>
</body>
</html>
子模板代码：
- extends指令声明这个模板继承自哪
list.html，代码：
{% extends "./base.html" %}
{% block css %}
<style>
body{
color: red;
}
</style>
{% endblock css %}
{% block main %}
{{ super() }} {# 继承父级模板的内容 #}
<p>{{ content }}</p>
{% endblock %}
模板继承使用时注意点：
-
不支持多继承，不能使用多个extends
-
为了便于阅读，在子模板中使用extends时，尽量写在模板的第一行。
-
不能在一个模板文件中定义多个相同名字的block标签，否则会覆盖。
-
当在页面中使用多个block标签时，建议给结束标签起个名字，当多个block嵌套时，阅读性更好。
CSRF 攻击防范
CSRF: 跨域请求伪造攻击。
pip install flask_wtf
flask_wtf本身提供了生成表单HTML页面的功能(基于wtforms提供)，常用于开发前后端不分离的表单页面，同时Flask-wtf 扩展模块还提供了一套完善的 csrf 防护体系，对于我们开发者来说，使用flask_wtf模块就可以非常简单解决CSRF攻击问题。
- 设置应用程序的 secret_key，用于加密生成的 csrf_token 的值
# 1. session加密的时候已经配置过了.如果没有在配置项中设置,则如下:
app.secret_key = "#此处可以写随机字符串#"
# 2. 也可以写在配置类中。
class Config(object):
DEBUG = True
SECRET_KEY = "dsad32DASSLD*13%^32"
"""加载配置"""
app.config.from_object(Config)
- 导入 flask_wtf 中的 CSRFProtect类，进行初始化，并在初始化的时候关联 app
# 方式1：
from flask_wtf import CSRFProtect
csrf = CSRFProtect() # 这块代码可能在文件中。
app = Flask(import_name=__name__, template_folder="templates")
# 项目配置代码之后
csrf.init_app(app) # 避免出现引用导包，所以提供了init_app的用法
# 方式2：
# from flask_wtf import CSRFProtect
# app = Flask(import_name=__name__, template_folder="templates")
# 项目配置代码之后
# CSRFProtect(app)
- 在表单中使用 CSRF 令牌:
<form action="/login" method="post">
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}" />
</form>
视图代码;
from flask import Flask, render_template, request, session
from flask_wtf import CSRFProtect
from flask_wtf.csrf import generate_csrf
app = Flask(__name__, template_folder="templates", static_folder="static")
# csrf = CSRFProtect()
# 配置
app.config.update({
"DEBUG": True,
"SECRET_KEY": ":123.,2,s,"
})
# csrf.init_app(app)
CSRFProtect(app)
@app.route("/")
def index():
title = "网站首页"
return render_template("index.html", **locals())
@app.route("/login", methods=["GET","POST"])
def login():
title = "登录页面"
print(">>>> 1")
if request.method == "GET":
print(">>>> 2")
token = generate_csrf()
return render_template("login.html", **locals())
else:
print(">>>> 3")
username = request.form.get("username")
password = request.form.get("password")
if username == "xiaoming" and password == "123456":
print(">>>> 4")
session["username"] = "xiaoming"
session["is_login"] = True
print(">>>> 6")
return "登录成功！<br><a href='/'>返回首页</a>"
else:
print(">>>> 5")
return "登录失败！<br><a href='/login'>重新登录！</a>"
if __name__ == '__main__':
app.run()
login.html，模板代码：
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>{{ title }}</title>
</head>
<body>
<form action="http://127.0.0.1:5000/login" method="post">
<input type="hidden" name="csrf_token" value="{{ token2() }}" />
<input type="hidden" name="csrf_token" value="{{ token }}" />
登录账号： <input type="text" name="username"> <br><br>
登录密码： <input type="password" name="password"> <br><br>
<button>登录</button>
</form>
</body>
</html>
index.html，代码：
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>{{ title }}</title>
</head>
<body>
{% if session.get("is_login") %}
<a href="/user">欢迎回到网站，{{ session["username"] }}</a>
{% else %}
<a href="{{ url_for('login') }}">登录</a>
{% endif %}
</body>
</html>
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
