简介
Jinja2是Python下一个被广泛应用的模版引擎,他的设计思想来源于Django的模板引擎,并扩展了其语法和一系列强大的功能。其中最显著的一个是增加了沙箱执行功能和可选的自动转义功能,这对大多应用的安全性来说是非常重要的(来源百度百科)。
Jinja2模板
Flask是一款开发Web服务端的框架,所以肯定是离不开页面的。上一章,我们使用路由返回数据时,返回内容中包含的有少量的HTML代码,如果需要的HTML代码多了,就很繁琐了,这时我们就可以使用Jinja2模板引擎。
- Flask提供的 render_template 函数封装了Jinja2模板引擎;
- render_template 函数的第一个参数是模板的文件名,后面的参数都是键值对,表示向模板中传递的参数值。
基本使用
创建一个视图函数渲染模板以及设置模板参数。
@app.route("/hello/<name>")
def hello(name):
return render_template("hello.html", name=name)
render_template函数第一个参数对应的是模板的文件名,后面的参数为向模板中传递的参数值。
Flask在程序文件夹中的templates子文件夹中根据模板文件名来寻找对应的模板。
所以需要在templates子文件夹下定义一个hello.html文件。
代码如下:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
{# name为视图函数传递过来的参数 #}
<h1>Hello, {{ name }}!</h1>
</body>
</html>
其中用 {{}} 来表示变量名,用于接收视图函数传递的参数,其变量名与视图函数传递的键名需要一致;
{# #} 表示注释,注释的内容不会在html中被渲染出来。运行效果如下:
上面使用模板接收了简单的变量,除此之外还可以接收字典,列表,对象和获取session中的内容等。下面来看一下使用模板接收一些复杂的类型数据。
修改后的视图函数代码:
@app.route("/hello/<name>")
def hello(name):
mydict = {
"name": '李四',
'age': 18
}
mylist = ['aaa', 'bbb', 'ccc']
session['name'] = "abc"
return render_template("hello.html", name=name, mydict=mydict, mylist=mylist);
模板页面代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h1>Hello, {{ name }}!</h1>
<h1>获取字典数据:{{ mydict['name'] }} --- {{ mydict['age'] }}</h1>
<h1>获取列表数据:{{ mylist[1] }}</h1>
<h1>通过过滤器修改变量(把值转换为大写形式):{{ mylist[0] | upper }}</h1>
<h1>获取session中的内容:{{ session.get("name") }}</h1>
<h1>请求头信息:{{ request.headers }}</h1>
</body>
</html>
运行效果如下:
除了上面用到的upper过滤器,Jinja2还提供了很多过滤器,如下是Jinja2常用的过滤器。
过滤器名 | 说明 |
---|---|
safe | 渲染值时不转义 |
capitalize | 把值的首字母转换成大写,其他字母转换成小写 |
lower | 把值转换成小写形式 |
upper | 把值转换成大写形式 |
title | 把值中每个单词的首字母都转换成大写 |
trim | 把值的首尾空格去掉 |
striptags | 渲染之前把值中所有的HTML标签都删掉 |
控制结构
Jinja2中提供了很多种控制结构,可以用来改变模块的渲染流程,如if、for等。
在Jinja2中使用if控制结构,语法格式和python的语法格式一样,但必须写在{% %}中,不同python的是有开始标签就必须要有结束标签。
{% if comment %}
<p>{{ comment }}</p>
{% else %}
<p>comment字典为空</p>
{% endif %}
for循环的使用,遍历一个字典中的所有数据。
{% for user in users %}
<p>姓名:{{ user['name'] }}, 年龄:{{ user['age'] }}</p>
{% endfor %}
上述的变量都是在视图函数返回时传递的,视图函数代码如下:
@app.route('/contro')
def contro():
users = [
{"name": "张三", "age":20},
{"name": "李四", "age":25},
{"name": "王五", "age":16},
{"name": "小华", "age":22}
]
comment = []
return render_template("contro.html", comment=comment, users=users)
页面完整代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
{% if users %}
{% for user in users %}
<p>姓名:{{ user['name'] }}, 年龄:{{ user['age'] }}</p>
{% endfor %}
{% else %}
<p>没有学生信息!</p>
{% endif %}
{% if comment %}
<p>{{ comment }}</p>
{% else %}
<p>comment字典为空</p>
{% endif %}
</body>
</html>
运行效果如下
模板继承
在实际开发中有时候会有很多重复使用的模块代码片段,这时我们可以把这些模块代码写入一个单独的文件,需要用时,直接继承使用,以避免重复编写。
创建一个名为base.html的基模板,用于编写公共部分模块。代码如下。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>
{% block title %}
{# 其他页面可以重写标题 #}
{% endblock %}
</title>
{% block css %}
{# 其他页面可以自定义加载样式文件 #}
{% endblock %}
</head>
<body>
{% block content %}
{# 其他页面内容 #}
{% endblock %}
</body>
</html>
block标签定义的元素可在继承模块中修改。上述定义了title、css、content三个模块,其他文件继承后可以重写这些模块中的内容。
新建一个模板文件继承base.html模板
{# 继承base.htm模块 #}
{% extends 'base.html' %}
{% block title %}
重写base.html中title模块的内容
{% endblock %}
{% block content %}
{# 重写base.html中content模块内容 #}
{% if users %}
{% for user in users %}
<p>姓名:{{ user['name'] }}, 年龄:{{ user['age'] }}</p>
{% endfor %}
{% else %}
<p>没有学生信息!</p>
{% endif %}
{% if comment %}
<p>{{ comment }}</p>
{% else %}
<p>comment字典为空</p>
{% endif %}
{% endblock %}
extentds关键字声明继承base.html模块,之后重写了base.html模板中的title和content模块。运行效果如下: