windows python web flask 模板开发快速入门

简介: windows python web flask 模板开发快速入门

windows python web flask 模板开发快速入门

tags: flask

文章目录

windows python web flask 模板开发快速入门

1. 简介

2. 语法

3. 方法

3.1 模板渲染

3.2 变量使用

3.3 控制结构

3.3.1 条件控制语句

3.3.2 for 循环

3.3.3 Jinja2 还支持宏 。宏类似 python 代码中的函数

3.3.4 import模板中导入

3.3.5 include模板代码片段可以写入单独的文件

3.3.6 block标签定义的元素可在extends衍生模板中修改

4 实战

4.1 for循环、if判断方法、变量的搭配

4.2 测试for循环中的loop变量,修改`watchlist.html`

4.3 render_template_string()函数的使用

1832b220aa754cd18c504acc7686a560.png

1832b220aa754cd18c504acc7686a560.png

1. 简介

模板是一个包含响应文本的文件,其中个包含用站位变量表示的动态部分,其具体值只在请求的上下文中才能知道。

渲染是一个使用真实值替换变量,在返回最终得到的响应字符串的过程。

Jinja2 是一个强大模板引擎用来渲染模板。

2. 语法

利用jinja2这样的模板引擎,我们可以将一部分的程序逻辑放到模板中去。简单的说,我们可以在模板中使用python语句和表达式来操作数据的输出。但需要注意的是,jinja2并不支持所有的python语法,并且出于效率和代码组织方面的考虑,我们应适度的使用模板,仅把和输出控制有关的逻辑放到模板中。


jinja2中允许在模板中使用大部分python对象,比如字符串,列表,字典,元组,整型,浮点型,布尔值。它支持基本的运算符(+,-,*,/等),比较符号(==,!=),逻辑符号(and,or,not和括号)以及in,is,None和布尔值(True,False)


{{ … }} 用来标记变量。

{% … %} 用来标记语句,比如 if 语句,for 语句等。

{# … #} 用来写注释。

3. 方法

3.1 模板渲染

用到三个文件

用到三个文件

templates\index.html

<h1>
    Hello World
</h1>

templates\user.html

{# {{ name }} 表示一种变量,模板中的占位符 #}
<h1>Hello,{{ name }}!</h1>

hello.py

from flask import Flask,render_template
# 1.初始化 Flask 对象
app = Flask(__name__)
# manager = Manager(app)
# 2. 设置路由和视图函数
@app.route('/')
def index():
    # return '<h1>Hello World!<h1>'
    return render_template('index.html')
@app.route('/user/<name>')
def user(name):
    # return '<h1>Hello,%s!<h1>' % name
    return render_template('user.html',name=name)
# 3.启动服务
if __name__ == '__main__':
    app.run(debug=True)
    # manager.run()

测试:

$ python hello.py
* Serving Flask app "hello" (lazy loading)
 * Environment: production
   WARNING: This is a development server. Do not use it in a production deployment.
   Use a production WSGI server instead.
 * Debug mode: on
 * Running on http://127.0.0.1:5000/ (Press CTRL+C to quit)
 * Restarting with stat
 * Debugger is active!
 * Debugger PIN: 175-682-414
$ curl http://127.0.0.1:5000
<h1>
    Hello World
</h1>
$ curl http://127.0.0.1:5000/user/liming
<h1>Hello,liming!</h1>

3.2 变量使用

Jinja2 能识别所有类型的变量,甚至是一些复杂的类型,例如列表、字典和对象。

<p>从字典中获取一个值: {{ mydict['key'] }}.</p>
<p>从列表中获取一个值: {{ mylist[3] }}.</p>
<p>通过一个变量索引,从列表中获取一个值: {{ mylist[myintvar] }}.</p>
<p>从对象的方法中获取一个值: {{ myobj.somemethod() }}.</p>

在模板中,jinja2支持使用”.”获取变量的属性,比如user字典中的username键值通过”.”获取即可。比如,user.username等价于user[username]

Jinja2 可以使用过滤器修改变量,过滤器名添加在变量名之后,中间使用竖线分割。

语法:

{{ 变量|过滤器 }}

例如,下述模板以首字母大写形式显示变量 name 的值:

Hello,{{ name|capitalize }}

Jinja2 变量过滤器

1832b220aa754cd18c504acc7686a560.png

safe 过滤器最值得一提。出于安全考虑,默认情况下,Jinja2 会把所有变量的值进行转义。比如,如果变量的值为 <h1>Hello World!</h1>,Jinja2 会在渲染模板时,将其转义为:&lt;h1&gt;Hello World!&lt;/h1&gt;。完整的过滤器列表,请参见官方文档

3.3 控制结构

3.3.1 条件控制语句

{% if user %}
    Hello,{{ user }}!
{% else %}
    Hello,Stranger!
{% endif %}

3.3.2 for 循环

<ul>
    {% for comment in comments %}
        <li>{{ comment }}</li>
    {% endfor %}
</ul>
HTML <ul> 标签**无序 HTML 列表**

在for循环内,jinja2提供了多个特殊变量,常用的for循环变量如下:

1671100973792.png

3.3.3 Jinja2 还支持宏 。宏类似 python 代码中的函数

{% macro render_comment(comment) %}
    <li>{{ render_comment(comment) }}</li>
{% endmacro %}
<ul>
    {% for comment in comments %}
        {{ render_comment(comment) }}
    {% endfor %}
</ul>

3.3.4 import模板中导入

为了重复使用宏,我们可以将其保存在单独的文件中,然后在需要使用的模板中导入:

{% import 'macros.html' as macros %}
<ul>
    {% for comment in comments %}
        {{ macros.render_comment(comment) }}
    {% endfor %}
</ul>

3.3.5 include模板代码片段可以写入单独的文件

需要在多处重复使用的模板代码片段可以写入单独的文件,再包含在所有模板中,以避免重复:

{% include 'comment.html' %}

另一种重复使用代码的强大方式是模板继承,它类似于 Python 代码中的类继承。首先,创 \建一个名为 base.html 的基模板:

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>{% block title %}{% endblock %} - My Application </title>
    {% endblock %}
</head>
<body>
    {% block body %}
    {% endblock %}
</body>
</html>

3.3.6 block标签定义的元素可在extends衍生模板中修改

block 标签定义的元素可在衍生模板中修改。在本例中,我们定义了名为 headtitlebody 的块。注意,title 包含在 head 中。下面这个示例是基模板的衍生模板:

{% extends "base.html" %}
{% block title %}Index{% endblock %}
{% block head %}
    {{ super() }}
    <style>
    </style>
{% endblock %}
{% block body %}
    <h1>Hello,World</h1>
{% endblock %}

extends 指令声明这个模板衍生自 base.html。在 extends 指令之后,基模板中的 3 个块被重新定义,模板引擎会将其插入适当的位置。注意新定义的 head 块,在基模板中其内容不是空的,所以使用 super() 获取原来的内容

4 实战

4.1 for循环、if判断方法、变量的搭配

app.py

# encoding=utf-8
from flask import Flask, render_template
app = Flask(__name__)
user = {"username": "xiaoxiao",
        "bio": "A girl who loves movies."}
movies = [
    {'name': 'My Neighbor Totoro','year':'1988'},
    {'name': 'Three Colours trilogy', 'year': '1993'},
    {'name': 'Forrest Gump', 'year': '1994'},
    {'name': 'Perfect Blue', 'year': '1997'},
    {'name': 'The Matrix', 'year': '1999'},
    {'name': 'Memento', 'year': '2000'},
    {'name': 'The Bucket list', 'year': '2007'},
    {'name': 'Black Swan', 'year': '2010'},
    {'name': 'Gone Girl', 'year': '2014'},
    {'name': 'CoCo', 'year': '2017'}
]
@app.route('/hi')
def hi():
    return "hello flask!"
@app.route("/watchlist")
def watchlist():
    return render_template("watchlist.html", user=user, movies=movies)
if __name__ == "__main__":
    app.run('0.0.0.0',debug=True)

templates/watchlist.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>{{ user.username }}'s watchlist</title>
</head>
<body>
<a href="{{ url_for('hi') }}">← Return</a>
<h2>{{ user.username}}</h2>
{% if user.bio %}
    <i>{{ user.bio }}</i>
{% else %}
    <i>This user has not provided a bio.</i>
{% endif %}
{# 以下是电影清单(这是注释) #}
<h5>{{ user.username }}'s watchlist ({{ movies|length }}):</h5>
<ul>
    {% for movie in movies %}
        <li>{{ movie.name }} - {{ movie.year }}</li>
    {% endfor %}
</ul>
</body>
</html>

执行:

$ python app.py 
 * Serving Flask app "app" (lazy loading)
 * Environment: production
   WARNING: This is a development server. Do not use it in a production deployment.
   Use a production WSGI server instead.
 * Debug mode: on
 * Running on http://0.0.0.0:5000/ (Press CTRL+C to quit)
 * Restarting with stat
 * Debugger is active!
 * Debugger PIN: 175-682-414

1832b220aa754cd18c504acc7686a560.png

HTML文件说明:

模板中使用←是HTML的实体,HTML实体除了用来转义HTML保留符号外,通常会被用来显示不容易通过键盘输入的字符。这里的←会显示为左箭头,另外,©用来显示版权标志。

在模板中添加python语句和表达式时,需要使用特定的定界符将其标识。

4.2 测试for循环中的loop变量,修改watchlist.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>{{ user.username }}'s watchlist</title>
</head>
<body>
<a href="{{ url_for('hi') }}">← Return</a>
<h2>{{ user.username}}</h2>
{% if user.bio %}
    <i>{{ user.bio }}</i>
{% else %}
    <i>This user has not provided a bio.</i>
{% endif %}
{# 以下是电影清单(这是注释) #}
<h5>{{ user.username }}'s watchlist ({{ movies|length }}):</h5>
<ul>
    {% for movie in movies %}
        <li>loop.index:{{ loop.index }}  loop.first:{{ loop.first }}
         loop.last:{{ loop.last }} - {{ movie.name }} - {{ movie.year }}</li>
    {% endfor %}
</ul>
</body>
</html>

1832b220aa754cd18c504acc7686a560.png

4.3 render_template_string()函数的使用

app.py

# encoding=utf-8
from flask import Flask, render_template_string
app = Flask(__name__)
user = {"username": "xiaoxiao",
         "bio": "A girl who loves movies."}
movies = [
    {'name' : 'My Neighbor Totoro','year':'1988'},
    {'name': 'Three Colours trilogy', 'year': '1993'},
    {'name': 'Forrest Gump', 'year': '1994'},
    {'name': 'Perfect Blue', 'year': '1997'},
    {'name': 'The Matrix', 'year': '1999'},
    {'name': 'Memento', 'year': '2000'},
    {'name': 'The Bucket list', 'year': '2007'},
    {'name': 'Black Swan', 'year': '2010'},
    {'name': 'Gone Girl', 'year': '2014'},
    {'name': 'CoCo', 'year': '2017'}
]
@app.route('/hi')
def hi():
    return "hello flask!"
@app.route("/watchlist")
def watchlist():
    return render_template_string(
        """{% for movie in movies %}
            <li>{{ movie.name }} - {{ movie.year }}</li>
            {% endfor %}
        """, movies=movies)
if __name__ == "__main__":
    app.run(debug=True)

测试结果

1832b220aa754cd18c504acc7686a560.png

相关文章
|
3天前
|
JSON 测试技术 数据库
Python的Flask框架
Python的Flask框架
|
7天前
|
Web App开发 数据采集 iOS开发
「Python+Dash快速web应用开发」
这是「Python+Dash快速web应用开发」系列教程的第十六期,本期将介绍如何在Dash应用中实现多页面路由功能。通过使用`Location()`组件监听URL变化,并结合回调函数动态渲染不同页面内容,使应用更加模块化和易用。教程包括基础用法、页面重定向及无缝跳转等技巧,并通过实例演示如何构建个人博客网站。
19 2
|
8天前
|
测试技术 开发者 Python
FastAPI的神奇之处:如何用Python引领Web开发的新浪潮,让你的项目一鸣惊人?
【8月更文挑战第31天】在现代软件开发中,Web应用至关重要,而FastAPI作为高性能Python Web框架,凭借简洁的语法与高效的开发体验,备受开发者青睐。本文将介绍FastAPI的基础概念、使用方法及最佳实践,涵盖路由、模板、请求对象等核心概念,并探讨其优势与社区扩展,助您高效构建Web应用。
29 1
WK
|
4天前
|
数据采集 API 开发者
很少有人用python开发web???
Python 是一种流行且广泛使用的编程语言,尤其在 Web 开发领域。它凭借简洁的语法、丰富的框架(如 Django 和 Flask)、强大的库支持及活跃的社区,成为许多开发者和企业的首选。Python 的易学性、高效性及广泛的应用场景(包括 Web API、微服务和数据分析等)使其在 Web 开发中占据重要地位,并将持续发挥更大作用。
WK
17 0
|
8天前
|
数据库 Java 数据库连接
Struts 2 与 Hibernate 的完美邂逅:如何无缝集成两大框架,轻松玩转高效 CRUD 操作?
【8月更文挑战第31天】本文通过具体示例介绍了如何在 Struts 2 中整合 Hibernate,实现基本的 CRUD 操作。首先创建 Maven 项目并添加相关依赖,接着配置 Hibernate 并定义实体类及其映射文件。然后创建 DAO 接口及实现类处理数据库操作,再通过 Struts 2 的 Action 类处理用户请求。最后配置 `struts.xml` 文件并创建 JSP 页面展示用户列表及编辑表单。此示例展示了如何配置和使用这两个框架,使代码更加模块化和可维护。
15 0
|
8天前
|
Java 缓存 数据库连接
揭秘!Struts 2性能翻倍的秘诀:不可思议的优化技巧大公开
【8月更文挑战第31天】《Struts 2性能优化技巧》介绍了提升Struts 2 Web应用响应速度的关键策略,包括减少配置开销、优化Action处理、合理使用拦截器、精简标签库使用、改进数据访问方式、利用缓存机制以及浏览器与网络层面的优化。通过实施这些技巧,如懒加载配置、异步请求处理、高效数据库连接管理和启用GZIP压缩等,可显著提高应用性能,为用户提供更快的体验。性能优化需根据实际场景持续调整。
30 0
|
8天前
|
Java 数据库连接 Spring
Struts 2 插件开发竟如魔法盛宴,为框架注入超能力,开启奇幻编程之旅!
【8月更文挑战第31天】在Web开发中,Struts 2插件开发允许我们在不改动框架核心代码的前提下,通过创建实现特定接口的Java类来扩展框架功能、调整其行为或促进与其他框架(如Spring、Hibernate)的集成,从而更好地满足特定业务需求。遵循良好的设计原则与实践,能够确保插件的高效稳定运行并提升整体项目的可维护性。具体步骤包括创建项目、定义插件类、实现初始化与销毁逻辑,并将插件部署至应用中。
29 0
|
8天前
|
前端开发 Java UED
告别页面刷新时代:Struts 2 Ajax技术揭秘,轻松实现动态加载,Web应用焕然一新!
【8月更文挑战第31天】在Web应用开发中,用户体验至关重要。为减少页面刷新带来的不适,Ajax技术应运而生。Struts 2作为流行的Java EE框架,通过内置的Ajax支持简化了无刷新页面动态加载的实现。本文通过对比传统请求响应模式,展示了Struts 2如何轻松实现Ajax功能,提升了用户体验和开发效率,并灵活地实现了数据交换。然而,使用Ajax时还需注意SEO和跨域请求等局限性。
21 0
|
8天前
|
数据采集 存储 数据挖掘
构建高效Web爬虫:Python与BeautifulSoup实战指南
【8月更文挑战第31天】本文将引导读者步入Web爬虫的世界,通过Python编程语言和BeautifulSoup库的强强联手,解锁数据抓取的艺术。文章不仅提供代码示例,还将深入探讨如何设计高效、可维护且符合伦理的爬虫程序。
|
8天前
|
JSON API 数据库
探索FastAPI:不仅仅是一个Python Web框架,更是助力开发者高效构建现代化RESTful API服务的神器——从环境搭建到CRUD应用实战全面解析
【8月更文挑战第31天】FastAPI 是一个基于 Python 3.6+ 类型提示标准的现代 Web 框架,以其高性能、易用性和现代化设计而备受青睐。本文通过示例介绍了 FastAPI 的优势及其在构建高效 Web 应用中的强大功能。首先,通过安装 FastAPI 和 Uvicorn 并创建简单的“Hello, World!”应用入门;接着展示了如何处理路径参数和查询参数,并利用类型提示进行数据验证和转换。
26 0