flask结合jinja2使用详解
作者：coleak 发布时间：2022-07-22 12:18:57
标签：flask,jinja2
jinja2简介
特征
沙箱中执行
强大的 HTML 自动转义系统保护系统免受 XSS
模板继承
及时编译最优的 python 代码
可选提前编译模板的时间
易于调试。异常的行数直接指向模板中的对应行。
可配置的语法
Jinja 分隔符
Jinja 在模板字符串中使用各种分隔符。
{％ ％}-陈述{{ }}-要打印到模板输出的表达式{# #}-模板输出中未包含的注释# ##-行语句
模板渲染
app.py
from flask import Flask,render_template,request
app = Flask(__name__)
@app.route('/')
def hello_world():
return render_template('index.html')
@app.route('/blog/<int:blog_id>')
def blog(blog_id):
page = request.args.get('page', default=1, type=int)
return render_template('blog.html',id=blog_id,page=page)
if __name__ == '__main__':
app.run()
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>coleak's page</title>
</head>
<body>
<h1>START</h1>
<h2>coleak2</h2>
<h3>coleak3</h3>
<h4>coleak4</h4>
<h5>coleak5</h5>
<h1>END</h1>
</body>
</html>
blog.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h1>这里是第{{ id }}位博客主的第{{ page }}页博客</h1>
</body>
</html>
效果测试
http://10.133.5.113:8000
http://10.133.5.113:8000/blog/3
http://10.133.5.113:8000/blog/3?page=6
模板访问变量属性
app.py
from flask import Flask,render_template,request
app = Flask(__name__)
class user:
def __init__(self,username,email):
self.username=username
self.email=email
@app.route('/')
def hello_world():
User=user('coleak','123@163.com')
person={
"username":"coleak",
"email":"123@666.com"
}
return render_template('index.html',user=User,person=person)
@app.route('/blog/<int:blog_id>')
def blog(blog_id):
page = request.args.get('page', default=1, type=int)
return render_template('blog.html',id=blog_id,page=page)
if __name__ == '__main__':
app.run()
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>coleak's page</title>
</head>
<body>
<h1>START</h1>
<div><h1>welcome {{ user.username }}</h1></div>
<div><h1>你的别名是{{ person.username }},邮箱是{{ person["email"] }}</h1></div>
<h2>coleak2</h2>
<h3>coleak3</h3>
<h4>coleak4</h4>
<h5>coleak5</h5>
<h1>END</h1>
</body>
</html>
效果测试
内置过滤器的使用
可以将过滤器应用于数据以对其进行修改。 例如，sum 筛选器可以对数据求和，escape 筛选器对它们进行转义，sort 筛选器对它们进行排序。
app.py
from flask import Flask,render_template,request
app = Flask(__name__)
class user:
def __init__(self,username,email):
self.username=username
self.email=email
@app.route('/')
def hello_world():
User=user('coleak','123@163.com')
person={
"username":"coleak",
"email":"123@666.com"
}
return render_template('index.html',user=User,person=person)
@app.route('/filter')
def filter():
User1=user('coleak',-123.456)
return render_template("filter.html",user=User1)
if __name__ == '__main__':
app.run()
filter.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>过滤器</title>
</head>
<body>
<div>{{ user.username }}长度为{{ user.username|length }}</div>
<div>{{ user.email }}绝对值为{{ user.email|abs }}</div>
</body>
</html>
效果测试
自定义过滤器
app.py
from flask import Flask,render_template,request
from datetime import datetime
app = Flask(__name__)
def my_filter(value,format="％Y年-％m月-％d日 ％H时:％M分"):
return value.strftime(format)
class user:
def __init__(self,username,email):
self.username=username
self.email=email
app.add_template_filter(my_filter,"time_filter")
@app.route('/')
def hello_world():
User=user('coleak','123@163.com')
person={
"username":"coleak",
"email":"123@666.com"
}
return render_template('index.html',user=User,person=person)
@app.route('/filter')
def filter():
mytime=datetime.now()
User1=user('coleak',-123.456)
return render_template("filter.html",user=User1,mytime=mytime)
if __name__ == '__main__':
app.run()
filter.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>过滤器</title>
</head>
<body>
<div>{{ mytime }}过滤后为{{ mytime|time_filter }}</div>
</body>
</html>
效果测试
控制语句
app.py
from flask import Flask,render_template,request
from datetime import datetime
app = Flask(__name__)
class user:
def __init__(self,username,email):
self.username=username
self.email=email
@app.route('/')
def hello_world():
User=user('coleak','123@163.com')
person={
"username":"coleak",
"email":"123@666.com"
}
return render_template('index.html',user=User,person=person)
@app.route('/control')
def control():
age=request.args.get('age')
age=int (age)
books=[{"name":"boo1",'price':12},{"name":"boo2",'price':18},{"name":"book3",'price':21}]
return render_template('control.html',age=age,books=books)
if __name__ == '__main__':
app.run()
control.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>控制语句</title>
</head>
<body>
<div>
{％ if age>18 ％}
<h2>可以进入网吧</h2>
{％ elif age==18 ％}
<h2>家长陪同下进入网吧</h2>
{％ else ％}
<h2>不可以进入网吧</h2>
{％ endif ％}
</div>
<div>
{％ for book in books ％}
<p>名称：{{ book.name }}</p>
<p>价格：{{ book.price }}</p>
{％ endfor ％}
</div>
</body>
</html>
效果测试
模板继承
模板继承是一项强大的功能，可减少代码重复并改善代码组织。 我们定义了一个基本模板，其他模板文件也从中继承。 这些模板文件将覆盖基本模板文件的特定块。
app.py
from flask import Flask,render_template,request
from datetime import datetime
app = Flask(__name__)
class user:
def __init__(self,username,email):
self.username=username
self.email=email
@app.route('/')
def hello_world():
User=user('coleak','123@163.com')
person={
"username":"coleak",
"email":"123@666.com"
}
return render_template('index.html',user=User,person=person)
@app.route('/base')
def base():
return render_template("base.html")
@app.route('/ch1')
def ch1():
return render_template("ch1.html")
@app.route('/ch2')
def ch2():
return render_template("ch2.html")
if __name__ == '__main__':
app.run()
base.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>{％ block title ％}{％ endblock ％}</title>
</head>
<body>
{％ block body ％}
{％ endblock ％}
</body>
</html>
ch1.html
{％ extends "base.html" ％}
{％ block title ％}
ch1的标题
{％ endblock ％}
{％ block body ％}
<div>ch1的body</div>
{％ endblock ％}
ch1.html
{％ extends "base.html" ％}
{％ block title ％}
ch2的标题
{％ endblock ％}
{％ block body ％}
<div>ch2的body</div>
{％ endblock ％}
加载静态文件
结构框架
add.py
from flask import Flask,render_template,request
from datetime import datetime
app = Flask(__name__)
class user:
def __init__(self,username,email):
self.username=username
self.email=email
@app.route('/')
def hello_world():
User=user('coleak','123@163.com')
person={
"username":"coleak",
"email":"123@666.com"
}
return render_template('index.html',user=User,person=person)
@app.route('/static')
def static_use():
return render_template("static.html")
if __name__ == '__main__':
app.run()
static.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>static</title>
<link rel="stylesheet" href="{{ url_for('static',filename=" rel="external nofollow" css/style.css") }}">
<script src="{{ url_for('static',filename="js/myjs.js") }}"></script>
</head>
<body>
<img src="{{ url_for('static',filename="images/flask.jpg") }}"></img>
</body>
</html>
myjs.js
alert('coleak');
style.css
body{
background-color: pink;
}
flask.jpg
效果测试
来源：https://blog.csdn.net/qq_63701832/article/details/129466957
0
投稿猜你喜欢
完美解决vue中报错 “TypeError: Cannot read properties of null (reading &ls- 如下所示：# 计算面积函数def area(width, height): return width * heightdef print_w
- 首先抛出我们在讨论使用回调编程时的一些观点：激活errback是非常重要的。由于errback的功能与except块相同，因此用户需要确保它
- 目录实例031：字母识词实例032：反向输出II实例033：列表转字符串实例034：调用函数实例035：设置输出颜色实例036：算素数实例0
- 用ASP实现搜索引擎的功能是一件很方便的事，可是，如何实现类似3721的智能搜索呢？比如，当在搜索条件框内输入“中国人民”时，自动从中提取“
- 利用序列产生主键值。 序列（Sequence）是一种可以被多个用户使用的用于产生一系列唯一数字的数据库对象。序列定义存储在数据字典中，通过提
- vue3 reactive函数用法reactive的用法与ref的用法相似，也是将数据变成响应式数据，当数据发生变化时UI也会自动更新。不同
- 摘要：本文介绍了字符与编码的发展过程，相关概念的正确理解。举例说明了一些实际应用中，编码的实现方法。然后，本文讲述了通常对字符与编码的几种误
- asp判断网址格式是否合法代码 具体实现办法见下列代码：<％ function checki
- 本文实例为大家分享了python学生信息管理系统的具体代码，供大家参考，具体内容如下#编译环境为python3 #学生信息管理系统包括基本的
- explain显示了mysql如何使用索引来处理select语句以及连接表.可以帮助选择更好的索引和写出更优化的查询语句.使用方法:在sel
- 我们熟悉了对象和类的基本概念。我们将进一步拓展，以便能实际运用对象和类。调用类的其它信息上一讲中提到，在定义方法时，必须有self这一参数。
- 本文实例总结了Python中字符串的常见操作技巧。分享给大家供大家参考，具体如下：反转一个字符串>>> S = '
- 一、安装Pyinstaller环境：python3.6、window10注意事项：python64位版本打包的exe，只能在64位操作系统使
- 本文实例讲述了Python实现Sqlite将字段当做索引进行查询的方法。分享给大家供大家参考，具体如下：默认从sqlite中获取到的数据是数
- 一、背景Python 是一门易于学习、功能强大的编程语言。它提供了高效的高级数据结构，还能简单有效地面向对象编程。Python 优雅的语法和
- <％@LANGUAGE="xxx" CODEPAGE="936"％>一般又分为<％
- 本文实例讲述了Laravel框架路由管理。分享给大家供大家参考，具体如下：路由中输出视图Route::get('/', fu
- 背景：使用python脚本传递参数在实际工作过程中还是比较常用，以下提供了好几种的实现方式：一、使用sys.argv的数组传入说明：使用sy
- 本文实例讲述了JS中的算法与数据结构之集合(Set)。分享给大家供大家参考，具体如下：集合(Set)同数学中所学的一样，集合(Set)是由一
