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.rhkb.cn/news/176075.html

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

相关文章

Flask 路由机制分析之一

Flask 路由机制分析之一

一、前言 《Flask Run运行机制剖析》这篇我们讲了应用启动的内部机制&#xff0c;启动后就开始监听Http请求了&#xff0c;请求过来如何跳到对应的函数执行&#xff0c;这就是路由机制。我们沿用上一篇例子&#xff0c;来探究一下app.route("/")内部干了些什么事。 …
阅读更多...
VDA到Excel方案介绍之自定义邮件接收主题

VDA到Excel方案介绍之自定义邮件接收主题

VDA标准是德国汽车工业协会&#xff08;Verband der Automobilindustrie&#xff0c;简称VDA&#xff09;制定的一系列汽车行业标准。这些标准包括了汽车生产、质量管理、供应链管理、环境保护、安全性能等方面的规范和指南。VDA标准通常被德国和国际上的汽车制造商采用&#x…
阅读更多...
【算法-数组1】二分查找 和 移除元素

【算法-数组1】二分查找 和 移除元素

今天&#xff0c;带来XXX的讲解。文中不足错漏之处望请斧正&#xff01; 理论基础 二分查找 给定一个 n 个元素有序的&#xff08;升序&#xff09;整型数组 nums 和一个目标值 target &#xff0c;写一个函数搜索 nums 中的 target&#xff0c;如果目标值存在返回下标&#…
阅读更多...
yum 命令

yum 命令

基本语法 yum [选项] [参数] 选项说明 -y 对所有提问都回答“yes” 参数说明 实操 yum list | grep firefox yum -y remove firefox yum -y install firefox
阅读更多...
使用MobaXterm向linux窗口化传输文件

使用MobaXterm向linux窗口化传输文件

使用MobaXterm向linux窗口化传输文件 之前上大学的时候&#xff0c;经常是XSheel配合Xftp使用&#xff0c;Xftp可以窗口化的往linux服务器传输文件&#xff0c;但是有一个问题&#xff0c;就是Xftp是收费的。 后来工作之后师兄给推荐了一个免费的&#xff0c;又好用的类似于Xf…
阅读更多...
uni-app/vue 文字转语音朗读（附小程序语音识别和朗读）uniapp小程序使用文字转语音播报类似支付宝收款播报小程序语音识别和朗读）

uni-app/vue 文字转语音朗读（附小程序语音识别和朗读）uniapp小程序使用文字转语音播报类似支付宝收款播报小程序语音识别和朗读）

uni-app/vue 文字转语音朗读&#xff08;小程序语音识别和朗读&#xff09; uniapp小程序功能集合 1、uniapp小程序文字转语音播报 一、第一种方式&#xff1a;直接加语音包 固定的文本 先利用工具生成了 文本语音mp3文件&#xff0c;放入项目中&#xff0c;直接用就好了 …
阅读更多...
【CSS】position

【CSS】position

CSS position 1.静态布局 static static 是 position 属性的默认值&#xff0c;表示没有定位。使用静态定位的元素会按照元素正常的位置显示&#xff0c;并且不会受到 top、bottom、left、right 和 z-index 属性的影响。 2.相对定位 relative 相对定位就是元素相对于自己默…
阅读更多...
Spring Cloud 之RabbitMQ的学习【详细】

Spring Cloud 之RabbitMQ的学习【详细】

服务通信 分布式系统通信两种方式&#xff1a; 直接远程调用&#xff08;同步&#xff09;借助第三方间接通信&#xff08;异步&#xff09; 同步通讯的问题 Feign就属于同步通讯。存在的如下问题 耦合度高&#xff0c;每次添加新的模块就要修改原有模块的代码性能下降&am…
阅读更多...
css（层叠样式表）

css（层叠样式表）

文章目录 一、CSS介绍二、CSS使用方式1. 行内样式/内联样式&#xff08;单一页面中使用&#xff09;设置背景颜色 background-color:green; 2. 内嵌样式&#xff08;少量页面中使用&#xff09;3. 外链样式表&#xff08;项目中使用&#xff09; 三、 样式表特征1. 层叠性2. 继…
阅读更多...
学习redis之前的泛泛而谈（特性介绍，应用场景，Ubuntu安装与通用命令介绍）

学习redis之前的泛泛而谈（特性介绍，应用场景，Ubuntu安装与通用命令介绍）

文章目录 前言关于分布式系统Redis特性Redis应用场景Redis5安装redis命令最核心的两个命令&#xff1a;get和setkeysexitsdelexpirettlredis中key的过期策略type redis数据类型的内部实现方式redis的单线程 前言 redis最重要的概念&#xff1a;在内存中存储数据 为什么要设计一…
阅读更多...
代购商城源码是否可以定制开发？

代购商城源码是否可以定制开发？

定制开发&#xff0c;符合个性需求 代购商城源码是现代电子商务中的重要工具&#xff0c;它为代购商提供了建立在线店铺、管理产品和订单、处理支付和物流等功能。然而&#xff0c;对于不同的代购商而言&#xff0c;在源码的基础上进行个性化定制开发无疑是提升竞争力和用户体验…
阅读更多...
2023年软件测试工具总结 —— 单元测试工具

2023年软件测试工具总结 —— 单元测试工具

在应用程序中&#xff0c;单元是具有一个或多个输入和单个输出的软件中最小可测试部分。单元测试是一种测试软件代码单元的方法&#xff0c;通常包括一个或两个输入&#xff0c;产生一个输出。单元测试主要关注独立模块的功能正确性&#xff0c;目的是确保每个单元都按照预期的…
阅读更多...
毛发渲染方案实现

毛发渲染方案实现

一、毛发材质概述 以前毛发只能用离线来做 现在实时毛发逐渐可能。长毛渲染和短毛渲染采用的是不同的方案。 二、长毛类制作分析 各向异性 kajiya算法 # 三、短毛类制作分析 四、制作心得及技巧
阅读更多...
成为一个优秀的测试工程师需要具备哪些知识和经验？

成为一个优秀的测试工程师需要具备哪些知识和经验？

看到这个题目&#xff0c;头脑中马上就拆分出了3个小问题&#xff1a; 1、什么是优秀的测试工程师&#xff1f; 2、优秀测试工程师需要哪些知识&#xff1f; 3、优秀测试工程师需要哪些经验&#xff1f; 一个个讲解。 一、什么才是一名优秀的测试工程师呢&#xff1f; 什么才是…
阅读更多...
奇富科技引领大数据调度革命：高效、稳定、实时诊断

奇富科技引领大数据调度革命：高效、稳定、实时诊断

日前&#xff0c;在世界最大的开源基金会 Apache旗下最为活跃的项目之一DolphinScheduler组织的分享活动上&#xff0c;奇富科技的数据平台专家刘坤元应邀为国内外技术工作者献上一场题为《Apache DolphinScheduler在奇富科技的优化实践》的精彩分享&#xff0c;为大数据任务调…
阅读更多...
C++进阶语法——智能指针【学习笔记（五）】

C++进阶语法——智能指针【学习笔记（五）】

文章目录 1、智能指针简介1.1 原始指针&#xff08;raw pointer&#xff09;的⼀些问题1.2 智能指针&#xff08;smart pointers&#xff09; 2、智能指针&#xff08;smart pointers&#xff09;——unique_ptr2.1 unique_ptr 的声明2.2 unique_ptr 的函数2.3 ⾃定义类型使⽤ …
阅读更多...
Go-Python-Java-C-LeetCode高分解法-第十二周合集

Go-Python-Java-C-LeetCode高分解法-第十二周合集

前言 本题解Go语言部分基于 LeetCode-Go 其他部分基于本人实践学习 个人题解GitHub连接&#xff1a;LeetCode-Go-Python-Java-C 欢迎订阅CSDN专栏&#xff0c;每日一题&#xff0c;和博主一起进步 LeetCode专栏 我搜集到了50道精选题&#xff0c;适合速成概览大部分常用算法 突…
阅读更多...
比较Excel中的两列目录编号是否一致

比较Excel中的两列目录编号是否一致

使用java代码比较excel中两列是否有包含关系&#xff0c;若有包含关系&#xff0c;核对编号是否一致。 excel数据样例如下&#xff1a; package com.itownet.hg;import org.apache.poi.xssf.usermodel.XSSFSheet; import org.apache.poi.xssf.usermodel.XSSFWorkbook;import j…
阅读更多...
C++设计模式_21_Iterator 迭代器（理解；面向对象的迭代器已过时；C++中使用泛型编程的方式实现）

C++设计模式_21_Iterator 迭代器（理解；面向对象的迭代器已过时；C++中使用泛型编程的方式实现）

Iterator 迭代器也是属于“数据结构”模式。GoF中面向对象的迭代器已经过时&#xff0c;C中目前使用泛型编程的方式实现&#xff0c;其他语言还在使用面向对象的迭代器。 文章目录 1. 动机(Motivation)2. 模式定义3. Iterator 迭代器代码分析4. 面向对象的迭代器与泛型编程实现…
阅读更多...
基于MFC的串口通信（Mscomm）

基于MFC的串口通信（Mscomm）

1、串口通信的概述&#xff1a; 串口是一种重要的通信资源&#xff0c;例如鼠标口、USB接口都是串口。串行端口是CPU和串行设备间的编码转换器。当数据从CPU经过端口发送出去的时候&#xff0c;字节数据会被转为串行的位&#xff0c;在接收数据时&#xff0c;串行的位被转换为…
阅读更多...
最新文章
推荐文章

Copyright @ 2022~2023

友情链接： 我的编程经验分享 一条长河网 尧图网站开发