【python】flask模板渲染引擎Jinja2,通过后端数据渲染前端页面

这篇具有很好参考价值的文章主要介绍了【python】flask模板渲染引擎Jinja2,通过后端数据渲染前端页面。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

你的 html 文件正在被 flask 的 jinja2 模板引擎正确渲染,flask框架零基础,进阶应用实战教学,python,flask,交互,jinja2,模板渲染

✨✨ 欢迎大家来到景天科技苑✨✨

🎈🎈 养成好习惯,先赞后看哦~🎈🎈

🏆 作者简介:景天科技苑
🏆《头衔》:大厂架构师,华为云开发者社区专家博主,阿里云开发者社区专家博主,CSDN新星创作者,掘金优秀博主,51CTO博客专家等。
🏆《博客》:Python全栈,前后端开发,人工智能,js逆向,App逆向,网络系统安全,数据分析,Django,fastapi,flask等框架,linux,shell脚本等实操经验,网站搭建,面试宝典等分享。

所属的专栏:flask框架零基础,进阶应用实战教学
景天的主页:景天科技苑

Jinja2模板引擎

flask在执行过程中的流程
你的 html 文件正在被 flask 的 jinja2 模板引擎正确渲染,flask框架零基础,进阶应用实战教学,python,flask,交互,jinja2,模板渲染

Flask内置的模板引擎Jinja2,它的设计思想来源于 Django 的模板引擎DTP(DjangoTemplates),并扩展了其语法和一系列强大的功能。

  • Flask提供的 render_template 函数封装了该模板引擎Jinja2
  • render_template 函数的第一个参数是模板的文件名,后面的参数都是键值对,表示模板中变量对应的数据值。
    我们在安装flask的时候就依赖安装了Jinja2
    你的 html 文件正在被 flask 的 jinja2 模板引擎正确渲染,flask框架零基础,进阶应用实战教学,python,flask,交互,jinja2,模板渲染

模板基本使用

  1. 在flask应用对象创建的时候,设置template_folder参数,默认值是templates也可以自定义为其他目录名,需要手动创建模板目录。
from flask import Flask, render_template
app = Flask(__name__, template_folder="templates")

2.在手动创建 templates 目录下创建一个模板html文件 index.html,代码:

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

3.在视图函数设置渲染模板并设置模板数据

from flask import Flask, render_template
#通过template_folder参数指定模板路径目录


app = Flask(__name__, template_folder="templates")


@app.route("/")
def index():
    title = "网页标题"
    content = "网页正文内容"
    #这里写模板文件。基于templates来写路径,locals()可以收集局部变量成字典类型数据,此处使用星星打散的方式,将字典数据转化为键值对形式传参
    #类似于这种
    # return render_template("index.html", title=title,content=content)

    return render_template("index.html", **locals())

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

运行程序,浏览器访问,可以看到网页标题和网页内容都是我们设置的字段内容
你的 html 文件正在被 flask 的 jinja2 模板引擎正确渲染,flask框架零基础,进阶应用实战教学,python,flask,交互,jinja2,模板渲染

flask中提供了2个加载模板的函数:render_template与render_template_string。

render_template:基于参数1的模板文件路径,读取html模板内容,返回渲染后的HTML页面内容,类型是字符串,不是response对象。

render_template_string:基于参数1以字符串的方式传参的模板内容,返回渲染后的HTML页面内容。
你的 html 文件正在被 flask 的 jinja2 模板引擎正确渲染,flask框架零基础,进阶应用实战教学,python,flask,交互,jinja2,模板渲染

代码案例:

from flask import Flask, render_template,render_template_string

app = Flask(__name__, template_folder="templates")


@app.route("/")
def index():
    title = "网页标题"
    content = "网页正文内容"
    print(locals())
    # 这里写模板文件。基于templates来写路径,locals()可以收集局部变量成字典类型数据,此处使用星星打散的方式,将字典数据转化为键值对形式传参
    # return render_template("index.html", title=title,content=content)

    html = render_template("index.html", **locals())
    print('rend_template返回',html,type(html))
    return html


#rend_template_string
@app.route("/tmp")
def tmp():
    title = "网页标题"
    content = "网页正文内容"
    #将网页内容以字符串的形式传参

    temp = """<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>{{title}}</title>
</head>
<body>
  <h1>{{content}}</h1>
</body>
</html>
    """
    html = render_template_string(temp, **locals())
    print('rend_template_string返回',html, type(html))
    return html



if __name__ == '__main__':
    app.run(debug=True)

浏览器访问/tmp路径url。返回也是字符串
你的 html 文件正在被 flask 的 jinja2 模板引擎正确渲染,flask框架零基础,进阶应用实战教学,python,flask,交互,jinja2,模板渲染

pycharm未识别模板文件配置

pycharm中,当我们设置了模板文件,但是pycharm并未识别
你的 html 文件正在被 flask 的 jinja2 模板引擎正确渲染,flask框架零基础,进阶应用实战教学,python,flask,交互,jinja2,模板渲染

此时我们可以设置当前项目的模板语言:
设置路径
files/settings/languages & frameworks/python template languages。
设置下拉框为jinja2,保存
你的 html 文件正在被 flask 的 jinja2 模板引擎正确渲染,flask框架零基础,进阶应用实战教学,python,flask,交互,jinja2,模板渲染

设置指定目录为模板目录,鼠标右键->Mark Directory as …-> Template Folder
你的 html 文件正在被 flask 的 jinja2 模板引擎正确渲染,flask框架零基础,进阶应用实战教学,python,flask,交互,jinja2,模板渲染

此时,pycahrm就不再有警告了
你的 html 文件正在被 flask 的 jinja2 模板引擎正确渲染,flask框架零基础,进阶应用实战教学,python,flask,交互,jinja2,模板渲染

模板输出变量

{{ 变量名 }},这种 {{ }} 语法叫做 变量代码块

Jinja2 模版中的变量代码块的输出的内容可以是Python的任意类型数据或者对象,只要它能够被 Python 的 __str__ 方法或者str()转换为一个字符串就可以,比如,可以通过下面的方式显示一个字典或者列表中的某个元素:

视图代码:

from flask import Flask, render_template, session, g

app = Flask(__name__, template_folder="templates")

app.config["SECRET_KEY"] = "my secret key"

@app.route("/")
def index():
    # 基本类型
    num = 100
    num2 = 3.14
    is_bool = True
    title = "网页标题"

    # 复合类型
    set_var = {1,2,3,4}
    list_var = ["小明", "小红", "小白"]
    dict_var = {"name": "root", "pwd": "1234557"}
    tuple_var = (1,2,3,4)

    # 更复杂的数据结构
    book_list = [
        {"id": 10, "title": "图书标题10a", "description": "图书介绍",},
        {"id": 13, "title": "图书标题13b", "description": "图书介绍",},
        {"id": 21, "title": "图书标题21c", "description": "图书介绍",},
    ]

    session["uname"] = "root"
    g.num = 300

    html = render_template("index.html", **locals())
    return html

@app.route("/user/<uid>")
def user1(uid):
    return "ok"

@app.route("/user")
def user2():
    return "ok"

if __name__ == '__main__':
    app.run(debug=True)

模板代码:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>{{title}}</title>
</head>
<body>
  <p>
    基本类型<br>
    num = {{num}}<br>
    {{num2}}<br>
    {{is_bool}}<br>
    {{title}}<br>
  </p>
  <p>
    {# 此处为模板注释 #}
    复合类型<br>
{#    {{set_var}}<br>#}
    {{set_var.pop()}}<br>
    {{list_var}}<br>
    {{list_var[1]}}<br>
    {{list_var.0}}<br>
    {{list_var[-1]}},点语法不能写负数下标<br>
    {{dict_var}}<br>
    {{dict_var["name"]}}<br>
    {{dict_var.name}}<br>
    {{tuple_var}}<br>
    {{tuple_var.0}}<br>
  </p>
  <p>
    更复杂的数据结构<br>
    {{book_list}}<br>
    {{book_list.2}}<br>
    {{book_list.1.title}}<br>
  </p>

  <p>
    内置的全局变量 <br>
    {{request}}<br>
    {{request.path}}<br>
    {{request.method}}<br>
    {{session.get("uname")}}<br>
    {{g.num}}<br>
  </p>
   {#  配置信息#}


  <p>{{ config.ENV }}</p>
  <p>{{ url_for("user1", uid=3) }}</p>    {# /user/3 #}
  <p>{{ url_for("user2", uid=3) }}</p>    {# /user?uid=3 #}
</body>
</html>

页面访问
你的 html 文件正在被 flask 的 jinja2 模板引擎正确渲染,flask框架零基础,进阶应用实战教学,python,flask,交互,jinja2,模板渲染

代码分析:

使用 {# #} 进行注释,注释的内容不会在html中被渲染出来

{#    <h1>{{ title }}!!</h1>#}
{#    <p>{{ data_list }}</p>#}
{#    <p>{{ data_list.1 }}</p>#}
    <p>{{ data_list[-1]}}</p>
    <p>{{ data_list | last }}</p>
    <p>{{ data_list | first }}</p>
    <p>{{ data_dict }}</p>
    <p>{{ data_dict.name }}</p>
    <p>{{ user_list.0 }}</p>
{#    <p>{{ user_list.0.name }}</p>#}

##模板中内置的变量和函数

你可以在自己的模板中访问一些 Flask 默认内置的函数和对象

####config

你可以从模板中直接访问Flask当前的config对象:

<p>{{ config.ENV }}</p>
<p>{{ config.DEBUG }}</p>

你的 html 文件正在被 flask 的 jinja2 模板引擎正确渲染,flask框架零基础,进阶应用实战教学,python,flask,交互,jinja2,模板渲染
你的 html 文件正在被 flask 的 jinja2 模板引擎正确渲染,flask框架零基础,进阶应用实战教学,python,flask,交互,jinja2,模板渲染

####request

就是flask中代表当前请求的request对象:

<p>{{ request.url }}</p>
<p>{{ request.path }}</p>
<p>{{ request.method }}</p>

####session

为Flask的session对象,显示session数据

 {{session.get("uname")}}

####g变量

在视图函数中设置g变量的 name 属性的值,然后在模板中直接可以取出
{{ g.name }}

####url_for()

url_for会根据传入的路由器函数名,返回该路由对应的URL,在模板中始终使用url_for()就可以安全的修改路由绑定的URL,则不比担心模板中渲染出错的链接:

 <p>{{ url_for("user1", uid=3) }}</p>    {# /user/3 #}
 <p>{{ url_for("user2", uid=3) }}</p>    {# /user?uid=3 #}

你的 html 文件正在被 flask 的 jinja2 模板引擎正确渲染,flask框架零基础,进阶应用实战教学,python,flask,交互,jinja2,模板渲染
你的 html 文件正在被 flask 的 jinja2 模板引擎正确渲染,flask框架零基础,进阶应用实战教学,python,flask,交互,jinja2,模板渲染

浏览器查看
你的 html 文件正在被 flask 的 jinja2 模板引擎正确渲染,flask框架零基础,进阶应用实战教学,python,flask,交互,jinja2,模板渲染

如果我们定义的路由URL是带有参数的,则可以把它们作为关键字参数传入url_for(),Flask会把他们填充进最终生成的URL中:

{{ url_for('index', id=1)}}
/index/1      {#  /index/<int:id> id被声明成路由参数 #}
/index?id=1   {#  /index          id被声明成查询参数 #}

总结

flask内置的模板引擎Jinja2,它的设计思想来源于 Django 的模板引擎DTP(DjangoTemplates),并扩展了其语法和一系列强大的功能。学会使用Jinja2,自己可以轻松开发出一个自己喜欢的网站,
我们在模板中多用变量,少用函数,函数放在视图函数中使用,这才符合MVT思想的路线。喜欢的朋友可以一键三连,flask高阶用法持续更新中!!!文章来源地址https://www.toymoban.com/news/detail-847255.html

到了这里,关于【python】flask模板渲染引擎Jinja2,通过后端数据渲染前端页面的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • Python(Web时代)——jinja2模板

    Jinja2是Flask框架默认支持的模板引擎,是python的web项目中被广泛应用的一种模板引擎,jinja2的作者与Flask是同一个人。 jinja2具有以下特点: 非常灵活,提供了控制结构、表达式与继承等 性能好 可读性强 渲染一个模板,通过render_template方法即可 引入渲染函数 使用之前需要先

    2024年02月04日
    浏览(43)
  • Ansible基础6——文件模块、jinja2模板

    模块名称 释义 blockinfile 插入、更新或删除由可自定义标记线包围的多行文本块 copy 将文件从本地或远程计算机复制到受管主机上的某个位置。类似于file模块,copy模块还可以设置文件属性,包括SELinux上下文件。 fetch 此模块的作用和copy模块类似,但以相反方式工作。此模块用

    2024年02月07日
    浏览(45)
  • 解决flask中jinja2插值变量变成字符串的办法

    今天在通过使用{{ variable_name }}这种方式插入html内容时,发现变量内容到了页面中全部变成了字符串, python代码: html代码中插入: 结果这在页面中都变成了类似下图的字符串,并没有渲染 应当在html代码中加入safe告诉引擎不要转义: 之后内容就可以正常被渲染而非显示字符

    2024年01月18日
    浏览(37)
  • ImportError: cannot import name ‘escape‘ from ‘jinja2‘

    使用flask时,导入jinja2报错如下: 然后在必应bing搜索现实jinja2版本应该小于3.1.0 之后在所用环境查看jinja2版本为3.1.2,所以jinja2版本应降到3.1.0一下,之后我把版本改为3.0.2。 但是导入发现依旧报错,然后仔细看了下报错原因。发现所用的环境是AppData下的,于是又把系统的环境

    2024年02月16日
    浏览(54)
  • 解决 ImportError: cannot import name ‘contextfilter‘ from ‘jinja2‘

    升级 jupyterhub -i 就是选择镜像源,不然更新很慢。 如果是conda环境,运行以下命令 国内镜像: 更新pip

    2024年02月12日
    浏览(49)
  • cannot import name Markup from jinja2解决方案

    将代码改一下,  代码如下:  运行结果:

    2024年02月11日
    浏览(43)
  • Flask:模板渲染

    本文章只作为个人笔记. 文章目录 前言 一、模板渲染 二、效果 模板渲染 使用render_template可以达到用html文件对网页进行渲染,可以传参数. 使用html收到变量,用{{变量名}}这样就能拿到变量的值了. blog_detail.html渲染效果: index.html渲染效果

    2024年01月23日
    浏览(44)
  • LayUI模板引擎渲染数据

    接上节Spring boot项目开发实战——(LayUI实现前后端数据交换与定义方法渲染数据) 模板引擎能简化开发,极大提高效率,小编之前使用过JSP和Thymeleaf,以及python的jinja2,这些是后端的模板引擎,数据的渲染都需要借助服务器,对html重新解析,在特定标识符处填入数据。 No

    2023年04月08日
    浏览(42)
  • 【Express】服务端渲染(模板引擎 EJS)

    EJS(Embedded JavaScript)是一款流行的模板引擎,可以用于在Express中创建动态的HTML页面。它允许在HTML模板中嵌入JavaScript代码,并且能够生成基于数据的动态内容。 下面是一个详细的讲解和示例,演示如何在Express中使用EJS模板引擎: 安装EJS:首先,在你的项目中安装EJS模板引

    2024年02月07日
    浏览(39)
  • Flask基本教程以及Jinjia2模板引擎简介

    直接看代码吧,非常容易上手: 访问结果展示: jinja2 是 Flask 作者开发的一个模板系统,起初是仿 Django 模板的一个模板引擎,为 Flask 提供模板支持,由于其灵活,快速和安全等优点被广泛使用。当我们开发 Web 应用程序时,通常需要将数据动态地渲染到 HTML 模板中,而 Py

    2024年02月07日
    浏览(40)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包