首页
所有分类
TAGS
文字工具 EMOJI BIBLE
编程 Python

一个基于flask的web应用诞生 使用模板引擎和表单插件（2）

Posted in Python onApril 11, 2017

经过了第一章的内容，已经可以做出一些简单的页面，首先用这种方式做一个登录页面，首先要创建一个login的路由方法：

@app.route("/login",methods=["GET"])
def login():
 html="<form method='post'>" \
 "<table>" \
 "<tr><td>请输入用户名</td><td><input type='text' name='username'/></td></tr>" \
 "<tr><td>请输入密码</td><td><input type='password' name='password'/></td></tr>" \
 "<tr><td><input type='submit' value='登录'/></td></tr>" \
 "</table>" \
 "</post>"
 return html

这个页面返回后是一个简单的登录页，显示结果如下：

一个基于flask的web应用诞生 使用模板引擎和表单插件（2）

然后是一个登录的post返回页:

@app.route("/login",methods=["POST"])
def loginPost():
 username=request.form.get("username","")
 password=request.form.get("password","")
 if username=="test" and password=="123" :
 return "登录成功"
 else:
 return "登录失败"

输入test和123后，显示登录成功

一个基于flask的web应用诞生 使用模板引擎和表单插件（2）

功能上当然是实现了，但是从其他方面来说，却很难说它是一个能够实际应用的程序，即使不考虑js脚本和css样式表，就从简简单单的维护来说，就是一场噩梦，比如说像增加一个验证码框，我想不会有人认为这是一件愉快的工作。

所以，首先来说，我们要把页面html部分独立出来，这点，flask提供了jinja2模板引擎来实现。

jinja2模板引擎同样符合flask最基础的约定，即众多配置中都有一个基础的默认值，相对jinja2来说，有一个最重要的默认值，即模板文件放在templates文件夹，这个文件夹虽然可以自定义，但目前来说，使用默认值已经足够了。

好，首先在PyCharm的项目根目录创建templates文件夹，然后在文件夹内创建login.html文件，当然目录结构如下：

一个基于flask的web应用诞生 使用模板引擎和表单插件（2）

在login.html中输入代码如下：

<!DOCTYPE html>
<html>
 <head>
 <title>欢迎您登陆--牛博客</title>
 </head>
 <body>
 <form method='post'>
 <table>
 <tr><td>请输入用户名</td><td><input type='text' name='username'/></td></tr>
 <tr><td>请输入密码</td><td><input type='password' name='password'/></td></tr>
 <tr><td><input type='submit' value='登录'/></td></tr>
 </table>
 </form>
 </body>
</html>

代码很简单，也名没有进行样式方面的美化，其实目前就我来说，仅仅是因为有了智能感知，就有足够的理由使用模板了，然后，对default.py的login方法进行修改代码为：

from flask import render_template #头部，引入模板渲染方法

@app.route("/login",methods=["GET"])
def login():
 return render_template("/login.html") 

 #渲染模板，默认找templates文件夹下的login.html文件

由于html模板内的代码和直接直接写在py文件中的一样，所以此时刷新页面，显示效果和刚刚相同，虽然显示效果没有明显的改观，但此时如果修改html中的某一元素，则会方便很多。

关于jinja2模板引擎还支持一些更强大的功能，比如使用index做一些说明：

基本用法

修改default.py中的部分代码为：

from flask import render_template #页头，导入渲染函数

@app.route("/")
def index():
 return render_template("index.html",site_name='myblog')

index.html中的代码为：

<!DOCTYPE html>
<html>
<head>
 <meta charset="UTF-8">
 <title>{{site_name}}</title>
</head>
<body>
<h1>这个站点的名字为 {{site_name}} </h1>
</body>
</html>

flask的render_template函数支持多参数，其中函数的第一个参数为模板名，之后可以提供若干参数，均为键值对，为模板中的变量提供数据。如此例子中，为site_name提供了myblog的值，而模板内使用{{参数名}}来表示一个变量

此时浏览器输入地址输出结果为：

<!DOCTYPE html>
<html>
<head>
 <meta charset="UTF-8">
 <title>myblog</title>
</head>
<body>
<h1>这个站点的名字为 myblog </h1>
</body>
</html>

jinja2模板还提供了一些变量过滤器，如代码：

<!DOCTYPE html>
<html>
<head>
 <meta charset="UTF-8">
 <title>{{site_name|upper}}</title>
</head>
<body>
<h1>这个站点的名字为 {{site_name}} </h1>
</body>
</html>

这时输出为：

<!DOCTYPE html>
<html>
<head>
 <meta charset="UTF-8">
 <title>MYBLOG</title>
</head>
<body>
<h1>这个站点的名字为 myblog </h1>
</body>
</html>

常用过滤器如下

safe 不转义
capitalize 首字母大写
lower 转换为小写
upper 转换为大写
trim 去收尾空格
striptages 去除html标签

除此之外，Jinja2的变量还可以是一些复杂类型，甚至可以使用一些复杂类型的常用方法，如：

<!DOCTYPE html>
<html>
<head>
 <meta charset="UTF-8">
 <title>{{site_name[2:]}}</title> 
</head>
<body>
<h1>这个站点的名字为 {{site_name}} </h1>
</body>
</html>

这时输出为：

<!DOCTYPE html>
<html>
<head>
 <meta charset="UTF-8">
 <title>blog</title>
</head>
<body>
<h1>这个站点的名字为 myblog </h1>
</body>
</html>

控制语句

控制语句是一个模板的基本功能，同样的jinja2也提供了相应的功能：

//选择
{% if name=='test' %}
 这是测试
{% else %}
 {{name}}，你好
{% endif %}

//循环
<ul>
 {% for blog in blogs%}
 {{ blog.title }}
 {% endfor%}
</ul>

除了这些基本用法，模板还为一些代码的重复使用提供了宏的功能，如将如下代码写入macros.html文件中

{% macro render_title(blog)%}
 <li>{{blog.title}}</li>
{% endmacro%}

然后在之前的模板中：

{% import 'macros.html' as macros %}
<ul>
 {% for blog in blogs %}
 {{ macros.render_title(blog) }}
 {% endfor %}
</ul>

执行结果与之前的完全相同

Jinja2还提供了一个更为强大的功能，即模板继承，这个个人感觉有点像java的sitemesh框架，它首先需要创建一个base.html的基模板：

<!DOCTYPE html>
<html>
<head>
 {% block head %}
 <meta charset="UTF-8">
 <title>{% block title%} {% endblock %} - 牛博客</title>
 <script src="http://cdn.bootcss.com/jquery/2.2.4/jquery.min.js"></script>
 {% endblock %}
</head>
<body>
 {% block body %}
 {% endblock %}
</body>
</html>

其中block标签的意思表示在子模板中可以修改，具体到此例子，则可修改的部分为 head，title，body。下面为子模板代码：

{% extends "base.html" %}
{% block title %}{{site_name[2:]}}{% endblock %}
{% block head %}
 {{super()}}
{% endblock %}

{% block body %}
 <h1>这个站点的名字为 {{site_name}} </h1>
{% endblock %}

此时执行结果仍为：

<!DOCTYPE html>
<html>
<head>
 <meta charset="UTF-8">
 <title>blog</title>
</head>
<body>
<h1>这个站点的名字为 myblog </h1>
</body>
</html>

现在有了模板引擎，不管怎么说，仅仅就页面层来说，已经可以很轻松的做出一些不错的功能了，但很明显，现在的界面还不是很美观，下一章将把现在主流的前端框架bootstrap与flask框架进行整合。

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持三水点靠木。

一个基于flask的web应用诞生 使用模板引擎和表单插件（2）

- Author -

双鱼座的牛

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Python 相关文章推荐
使用Python的Bottle框架写一个简单的服务接口的示例
Aug 25 Python
Python使用回溯法子集树模板获取最长公共子序列（LCS）的方法
Sep 08 Python
浅谈利用numpy对矩阵进行归一化处理的方法
Jul 11 Python
python实现flappy bird小游戏
Dec 24 Python
在python中使用xlrd获取合并单元格的方法
Dec 26 Python
Python docx库用法示例分析
Feb 16 Python
python 创建一维的0向量实例
Dec 02 Python
Python Print实现在输出中插入变量的例子
Dec 25 Python
Django调用百度AI接口实现人脸注册登录代码实例
Apr 23 Python
Python selenium模拟手动操作实现无人值守刷积分功能
May 13 Python
怎么解决pycharm license Acti的方法
Oct 28 Python
Python requests用法和django后台处理详解
Mar 19 Python
非递归的输出1-N的全排列实例(推荐)
Apr 11 #Python
一个基于flask的web应用诞生（1）
Apr 11 #Python
Python 文件处理注意事项总结
Apr 10 #Python
python非递归全排列实现方法
Apr 10 #Python
python 生成器生成杨辉三角的方法(必看)
Apr 10 #Python
Python贪吃蛇游戏编写代码
Oct 26 #Python
OpenCV实现人脸识别
Apr 07 #Python
mixin(1) timestamp(1) ref(1) 游标(1) ECharts(3) props(1) 临时表(1) ip连接(1) 表变量(1) GTID(1)
You might like
PHP strtotime函数详解
2009/12/18 PHP
PHP __autoload函数（自动载入类文件）的使用方法
2012/02/04 PHP
thinkphp学习笔记之多表查询
2014/07/28 PHP
最新制作ThinkPHP3.2.3完全开发手册
2015/11/23 PHP
Ucren Virtual Desktop V2.0
2006/11/07 Javascript
为radio类型的INPUT添加客户端脚本(附加实现JS来禁用onClick事件思路代码)
2010/11/11 Javascript
js中arguments的用法(实例讲解)
2013/11/30 Javascript
JavaScript中合并数组的N种方法
2014/09/16 Javascript
AngularJS入门教程之Hello World!
2014/12/06 Javascript
JavaScript cookie详解及简单实例应用
2016/12/31 Javascript
详解js中Array的方法及技巧
2018/09/12 Javascript
Vue 中可以定义组件模版的几种方式
2019/08/06 Javascript
python数据结构之列表和元组的详解
2017/09/23 Python
Python实现判断并移除列表指定位置元素的方法
2018/04/13 Python
神经网络(BP)算法Python实现及应用
2018/04/16 Python
基于Django URL传参 FORM表单传数据 get post的用法实例
2018/05/28 Python
对Pandas MultiIndex(多重索引)详解
2018/11/16 Python
pycharm远程开发项目的实现步骤
2019/01/20 Python
利用python实现在微信群刷屏的方法
2019/02/21 Python
python循环嵌套的多种使用方法解析
2019/11/29 Python
python二分法查找算法实现方法【递归与非递归】
2019/12/06 Python
Python while循环使用else语句代码实例
2020/02/07 Python
使用tensorflow框架在Colab上跑通猫狗识别代码
2020/04/26 Python
python3中TQDM库安装及使用详解
2020/11/18 Python
python爬虫分布式获取数据的实例方法
2020/11/26 Python
Pytorch实现WGAN用于动漫头像生成
2021/03/04 Python
CSS3 三维变形实现立体方块特效源码
2016/12/15 HTML / CSS
让IE6支持css3，让 IE7、IE8 都支持CSS3
2011/10/09 HTML / CSS
初婚未育未抱养证明
2014/01/12 职场文书
经销商培训邀请函
2014/01/21 职场文书
班主任高考寄语
2015/02/26 职场文书
2015年乡镇人大工作总结
2015/04/22 职场文书
餐厅服务员管理制度
2015/08/05 职场文书
护士自荐信范文（2016推荐篇）
2016/01/28 职场文书
小公司融资，商业计划书的8切记
2019/07/15 职场文书
大学生奖学金获奖感言（范文）
2019/08/15 职场文书