Flask基本教程以及Jinjia2模板引擎简介

flask基本使用

直接看代码吧,非常容易上手:

# 创建flask应用
app = Flask(__name__)# 路由
@app.route("/index", methods=['GET'])
def index():return "FLASK:欢迎访问主页!"if __name__ == "__main__":app.run()

访问结果展示:
在这里插入图片描述

jinjia2模板引擎

jinja2 是 Flask 作者开发的一个模板系统,起初是仿 Django 模板的一个模板引擎,为 Flask 提供模板支持,由于其灵活,快速和安全等优点被广泛使用。当我们开发 Web 应用程序时,通常需要将数据动态地渲染到 HTML 模板中,而 Python jinja2 模版技术正是为此而生的。该引擎在一定程度上实现了前后端分离(前后端代码层面的分离)。

模板目录

创建templates文件夹,用于存放模板文件(HTML模板),flask默认会在templates目录下寻找对应的html文件

模板语法

普通访问

模板中可以通过形如 {{obj.name}} 的形式访问后端的普通数据,例如变量、对象、列表等。

<p>{{ name }}  <!-- name 就是一个变量 -->{{ obj.name }}  <!-- 提取 obj 对象的属性 -->{{ obj["name"] }}  <!-- 和 obj.name 等效 -->
</p>

控制结构:遍历

通过如下形式,实现遍历的效果:

{% for item in students  %}
<tr><td>{{item.name}}</td><td>{{item.age}}</td><td>{{item.sex}}</td>
</tr>
{% endfor %}

控制结构:判断

支持类似于if、else的表达式

<!-- 表达式 -->
{% if count > 10 %}<p>There are too many items.</p>
{% else %}<p>There are {{ count }} items.</p>
{% endif %}

控制结构:跳出循环、继续执行

{% for i in [1,2,3] %}{% if i == 1 %}{{ i }}{% continue %}{% else %}{% break %}{% endif %}
{% endfor %}

表达式

在模板中,支持python的表达式语法,例如:

  • /
  • and
  • in
  • or

过滤器

过滤器就是函数,把当前的变量传入过滤器,过滤器根据自己的功能对变量进行相应的处理,再返回对应的值,并将结果渲染到网页中,起到了数据处理的作用。例如:

  • 绝对值
  • 最大值
  • 最小值

模板的继承与包含

django中的模板引擎,就具备模板的继承和包含功能。同样,jinjia2,也具备这样的功能,起到了模板复用、模块化开发的效果。

继承:

-----父亲-----

{% block title %}           {# 声明一个名为 title 的block #}<p>This is title</p>{% block content %}     {# title 内部嵌套了一个名为 content 的block #}{% endblock %}
{% endblock %}{% block foot %}<span>This is foot</span>
{% endblock %}

它里面定义了很多的 block, 每个 block 都有自己的名字(block的名字不能重复): {% block blok_name %}...{% endblock %} ,在 block 中,我们可以写入一些 html 代码,让子模板继承。

各个 block 之间是可以嵌套的

注意每个 block 要有一个 {% endblock %}

-----孩子-----

{% extends "mother.html" %}             {# 继承母版 #}{% block content %}                     {# 重写某个block #}<span>This is content, and the mother.html doesn't have this.</span>
{% endblock %}{% block foot %}{{ super() }}                       {# 继承母版中的 foot block 的内容 #}<span>New foot content</span>
{% endblock %}

{% extend %} 非常关键:它告诉模板要继承另一个模板。并且这个标签要放在模板的最上面。

当然,继承的标签可以写路径: {% extends "layout/default.html" %}

如果子模板没有重写母版中的某个block,则会默认使用母版中的block。

包含:

{% include 'header.html' %}{% include "sidebar.html" ignore missing %}  			{# ignore missing:如果找不到模板,可以忽略 #}{% include ['special_sidebar.html', 'sidebar.html'] ignore missing %}  {# 可以导入列表 #}{% include "sidebar.html" ignore missing without context %}            {# without context 可以不携带上下文 #}{% include "sidebar.html" ignore missing with context %}            {# with context 可以携带上下文 #}

上下文:其实就是模板中定义的变量,我们渲染时会将上下文传递给模板:template.render(context) ,而我们嵌套其他模板时,也可以将它们中的上下文包含进来,这样在当前模板中也可以使用被嵌套模板中的上下文。(因为目前相关的实战经验较少,暂时不知道什么样的场景会用到模板上下文)

场景分析:

  • 代码复用。html中的头部部分、底部部分的标签,可以单独抽象为一个模板,实现代码复用,减少了代码冗余。
  • 模块化开发。比如一个页面中的两个板块,A板块抽象为一个模板,B板块抽象为一个模板。通过包含的方式,将其引入,从而实现模块发开发的目的。

根据之前的经验,VUE、react均有相关代码复用、模块化开发相关的支持。

个人的一些思考

关于前后端分离

无论是django还是flask的模板引擎,他们都是在一定程度上实现了前后端分离,但是还不是完全的前后端分离。

其中前后端分离体现在:

  • 前后端代码分离。前端页面与后端处理程序分离,降低了前后端代码耦合。

分离不完全体现在:

  • 渲染的网页 还是由后端程序来返回(某种程度上还是服务端渲染)
  • 路由 依然在后端程序中进行设置
  • 模板中依然嵌入了某种语法,例如遍历等。不过这个应该不算,毕竟VUE、react中均有相关的数据处理的语法。
  • 模板引擎提供了很多数据过滤器,而这些过滤器函数 与 JavaScript的函数/过滤器 功能上是重合的,如果说分离得再彻底一些,那么相关的数据处理应该完全扔给前端的JavaScript来处理。

关于使用场景

目前,前后端分离,是一种WEB开发的主流趋势。那么,在python web开发中,何时使用vue、react等前端框架?何时使用自带的模板引擎?

我认为:

  • 如果是一些开发周期较长、规模较大、项目较为复杂的大型项目 或者说以学习为目的,那么可以考虑使用vue、react等成熟的前端框架开发。python仅用于返回数据,不适用其内置的模板引擎。
  • 如果就是非常简单的小型项目,那么完全可以使用django或者flask的模板引擎来进行前端页面的数据渲染,达到快速开发的目的。毕竟,使用vue、react等框架,需要单独建立项目,还需要进行各种配置,掌握各种命令。相比之下,这种模板引擎,就显得非常容易上手。

附代码

后端

from flask import Flask, jsonify
from flask import render_template
from flask_cors import CORS# 创建flask应用
app = Flask(__name__)
# 配置跨域请求。r'/*' 是通配符,让本服务器所有的 URL 都允许跨域请求
CORS(app, resources=r'/*')# 路由
@app.route("/", methods=['GET'])
@app.route("/index", methods=['GET'])
def index():return "FLASK:欢迎访问主页!"# 返回json数据
@app.route("/getOneData", methods=['GET'])
def getOneData():student = {"age": 15,"name": "zhangsan","sex": "man"}return jsonify(student)# 返回网页
# 利用jinjia2渲染引擎,向模板中渲染数据
@app.route("/studentInfo", methods=['GET'])
def studentInfo():student = {"age": 15,"name": "zhangsan","sex": "man"}students = [{"age": 101,"name": "zhangsan","sex": "man"},{"age": 123,"name": "lisi","sex": "man"},{"age": 336,"name": "wangwu","sex": "man"}]hello = "欢迎来到flask项目!"return render_template('student.html', title='学生信息', hello=hello, student=student, students=students)if __name__ == "__main__":# 0.0.0.0代表所有主机均可以访问,开启之后可通过服务器的IP地址访问网站# 默认端口为5000# app.run(port=5001, debug=True)app.run(host='0.0.0.0', port=5001, debug=True)

前端

<html>
<style>
/* Table Head */
table{
border-spacing: 0;
}
#table-6 thead th {
background-color: rgb(128, 102, 160);
color: #fff;
border-bottom-width: 0;
}/* Column Style */
#table-6 td {
color: #000;
}
/* Heading and Column Style */
#table-6 tr, #table-6 th {
border: 1px solid rgb(128, 102, 160);
}/* Padding and font style */
#table-6 td, #table-6 th {
padding: 5px 10px;
font-size:30px;
font-family: Verdana;
font-weight: bold;
}
td{border:1px solid rgb(128, 102, 160) ;
}
</style><head><title>{{ title }}</title></head><body><h1>{{hello}}</h1><h1>姓名:{{student.name}}</h1><h1>年龄:{{student.age}}</h1><h1>性别:{{student.sex}}</h1><br><br><br><table id="table-6"><thead><tr><th>姓名</th><th>年龄</th><th>性别</th></tr></thead><tbody><tr><td>item.name</td><td>item.age</td><td>item.sex</td></tr><tr><td>item.name</td><td>item.age</td><td>item.sex</td></tr>{% for item in students  %}<tr><td>{{item.name}}</td><td>{{item.age}}{{item.age}}</td><td>{{item.sex}}</td></tr>{% endfor %}</tbody></table></body>
</html>

参考链接

某个jinjia2的教程

http://docs.jinkan.org/docs/jinja2/index.html

博客园某博主

https://www.cnblogs.com/wztshine/p/16054582.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/123784.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

OpenCV学习笔记

OpenCV基础 threshold函数的使用 https://blog.csdn.net/u012566751/article/details/77046445 图像的二值化就是将图像上的像素点的灰度值设置为0或255&#xff0c;这样将使整个图像呈现出明显的黑白效果。在数字图像处理中&#xff0c;二值图像占有非常重要的地位&#xff0…

线扫相机DALSA--常见问题一:软件安装顺序

1.软件安装顺序 先安装&#xff1a;Sapera_LT_SDK&#xff0c;后安装Xtium-CL MX4驱动。 2.初次安装CamExpert&#xff0c;重启电脑后未找到相机 Settings(搜索协议)配置完毕后&#xff0c;需点击Detect Camera(一键查找相机)按钮&#xff0c;搜索相机。第一次查找相机耗时会略…

25期代码随想录算法训练营第三天 | 链表 part 2

目录 24. 两两交换链表中的节点19.删除链表的倒数第N个节点面试题 02.07. 链表相交142.环形链表II 24. 两两交换链表中的节点 链接 双指针 # Definition for singly-linked list. # class ListNode: # def __init__(self, val0, nextNone): # self.val val # …

聚观早报 |蔚来推出婚车服务;长城汽车第三季度财报

【聚观365】10月30日消息 蔚来推出婚车服务 长城汽车第三季度财报 AI汽车机器人极越01上市 谷歌投资初创公司Anthropic 东方财富第三季度营收 蔚来推出婚车服务 据蔚来汽车官方消息&#xff0c;蔚来宣布推出“蔚来用户专享”的婚庆用车定制服务。 据悉&#xff0c;该服务…

Mac删除照片快捷键ctrl加什么 Mac电脑如何批量删除照片

Mac电脑是很多人喜欢使用的电脑&#xff0c;它有着优美的设计、高效的性能和丰富的功能。如果你的Mac电脑上存储了很多不需要的照片&#xff0c;那么你可能会想要删除它们&#xff0c;以节省空间和提高速度。那么&#xff0c;Mac删除照片快捷键ctrl加什么呢&#xff1f;Mac电脑…

微信小程序实现微信登录(Java后台)

这两天在自己的小项目中加入了微信小程序的很多功能&#xff0c;今天来说一下关于微信授权登录的部分。 需要的材料 1&#xff1a;一个可以测试的微信小程序 2&#xff1a;此微信小程序的APPID和APPscret 流程 微信用户对应一个小程序都有一个唯一的openid&#xff0c;微信…

【文末送书】AI时代数据的重要性

欢迎关注博主 Mindtechnist 或加入【智能科技社区】一起学习和分享Linux、C、C、Python、Matlab&#xff0c;机器人运动控制、多机器人协作&#xff0c;智能优化算法&#xff0c;滤波估计、多传感器信息融合&#xff0c;机器学习&#xff0c;人工智能等相关领域的知识和技术。关…

transforms.Resize(512, interpolation=Image.BICUBIC)

t [] t.append(transforms.Resize(512, interpolationImage.BICUBIC)) transform transforms.Compose(t)代码没有debug&#xff0c;看见上述代码以为是将整张图片resize成&#xff08;512&#xff0c;512&#xff09;&#xff0c;实则是固定高度为512&#xff0c; 宽度为保持…

分享个自己写的小程序解包工具

闲聊 前几天在吾爱破解上看到一个小程序逆向的帖子&#xff1a;windows下通杀wx小程序云函数实战 &#xff0c;想着自己也学习一下怎么逆向小程序&#xff0c;一搜 unveilr 仓库没了&#xff0c;看评论好像开始收费了。 我就用aardio写了一个解密和解包工具&#xff0c;这里免…

Kotlin协程核心理解

一、协程是什么&#xff1f; 1.1 基本概念的理解 我们知道JVM中的线程的实现是依赖其运行的操作系统决定的&#xff0c;JVM只是在上层进行了API的封装&#xff0c;包含常见的有线程的启动方法&#xff0c;状态的管理&#xff0c;比如&#xff1a;Java中抽象出了6种状态&#x…

深入理解指针3

提示&#xff1a;文章写完后&#xff0c;目录可以自动生成&#xff0c;如何生成可参考右边的帮助文档 目录 前言 1. 字符指针变量 2. 数组指针变量 2.1 数组指针变量是什么&#xff1f; 2.2 数组指针变量怎么初始化 3. 二维数组传参的本质 4. 函数指针变量 4.1 函数指针变量的创…

Pandas数据导入和导出:CSV、Excel、MySQL、JSON

导入MySQL查询结果&#xff1a;read_sql import pandascon "mysqlpymysql://user:pass127.0.0.1/test" sql "SELECT * FROM student WHERE id 2"# sql查询 df1 pandas.read_sql(sqlsql, concon) print(df1)导入MySQL整张表&#xff1a;read_sql_table…

springboot自定义404页面

添加配置类 import java.io.File; import java.io.FileOutputStream; import java.io.IOException; import javax.servlet.Servlet; import org.apache.catalina.startup.Tomcat; import org.apache.catalina.valves.ErrorReportValve; import org.apache.coyote.UpgradeProtoc…

并发安全问题之超卖问题

并发安全问题之超卖问题 乐观锁总结&#xff1a; 优点&#xff1a;不加锁性能好。 缺点&#xff1a;同时请求成功率低&#xff08;即只要发现数据变了就放弃了&#xff09;。 乐观锁思想的具体体现&#xff1a;一共两步&#xff0c;第一步&#xff0c;先查询状态。第二步&…

【数据库】

文章目录 1. 聚合函数练习&#xff1a; 2. 子查询 1. 聚合函数 where中过滤条件中不能写聚合函数&#xff0c;有聚合函数需要写到Having中 方式一效率高&#xff1a; Select执行流程 练习&#xff1a; 2. 第七题&#xff1a;count(*)有问题&#xff0c;原因是左外连接后…

html转pdf、Img

一.转pdf // 导出页面为PDF格式 /* eslint-disable */ //不使用JQuery版的 import html2canvas from html2canvas import JsPDF from jspdf/*** param ele 要生成 pdf 的DOM元素&#xff08;容器&#xff09;* param padfName PDF文件生成后的文件名字* */funct…

Apache Doris (四十八): Doris表结构变更-替换表

🏡 个人主页:IT贫道_大数据OLAP体系技术栈,Apache Doris,Clickhouse 技术-CSDN博客 🚩 私聊博主:加入大数据技术讨论群聊,获取更多大数据资料。 🔔 博主个人B栈地址:豹哥教你大数据的个人空间-豹哥教你大数据个人主页-哔哩哔哩视频 目录

Leetcode—275.H指数II【中等】

2023每日刷题&#xff08;十三&#xff09; Leetcode—275.H指数II 算法思想 实现代码 int minValue(int a, int b) {return a < b ? a : b; }int hIndex(int* citations, int citationsSize){int left, right;left 0;right citationsSize - 1;while(left < right) …

Openssl数据安全传输平台017:Linux客户端代码的编译与调试-Bug记录

文章目录 1 在windows上先预编译2 Centos上进入项目文件夹进行编译2.0 最终的编译指令2.1 找不到lprotobuf&#xff0c;找不到protobuf的google文件夹2.1.1 编译指令及提示2.1.2 问题分析2.1.3 解决办法 2.2 json类中方法unreference2.2.1 编译指令及提示2.2.2 问题分析 *** 最…

【工具使用】NPS内网穿透工具介绍

文章目录 前言一、内网穿透二、NPS概述三、NPS原理四、NPS服务器搭建(一)云服务器配置 五、NPS内网穿透演示(一)演示案例一(二)演示案例二 六、NPS内网穿透检测建议(一)流量监控(二)流量协议分析(三)网络行为异常检测 七、NPS内网穿透防范建议(一)阻止或隔离流量(二)更新和强化…