Flask Web开发--狗书笔记003--第三章 模板
一般而言，请求会改变程序的状态，而这种变化也会在视图函数中产生。
举个栗子，当我们在网站中注册了一个新账户，用户在表单中输入电子邮箱和密码，然后点击提交按钮。
服务器接收到包含y用户输入数据的请求，然后Flask把请求分发到注册请求的视图函数。
这个视图函数需要访问数据库，添加新用户，然后生成相应回送浏览器。
这两个过程分别是业务逻辑和表现逻辑。
表格中的数据由数据库中读取的数据以及必要的html字符串连接在一起。把表现逻辑移到模板中能够提升程序的可维护性。
模板是一个包含了响应文本的文件，其中包含用占位变量表示的动态部分，其具体值只有在请求的上下文中才能知道。
用真实值替换变量，再返回最终得到的字符串，这一个过程称之为渲染。
为了渲染模板，Flask使用了一个叫做Jinjia2的模板引擎 。
Jinjia2模板引擎
给一个简单的栗子…
<h1>Hello,{{ name }}!h1>渲染模板
默认情况下，Flask在程序文件夹中的template子文件夹中寻找模板。
Flask提供的render_template函数把Jinjia2模板引擎集成到了程序中。render_template函数的第一个参数是模板的文件名，随后的参数都是键值对。
示例代码:
@app.route('/user/')
def index(name):
return render_template('index.html',name=name)变量
{{name}} 结构表示一个变量，是一种特殊的占位符。目的是告诉模板引擎这个位置的值从渲染模板时使用的数据中获取。
Jinjia2能够识别所有类型的变量，例如字典、列表和对象。
举几个栗子…
<p>A value from a dictionary:{{ mydict['key'] }}p>
<p>A value from a list:{{ mylist[3] }}p>
<p>A value from a dictionary:{{ mylist[myintvar] }}p>
<p>A value from a object's method:{{ myobj.somemethod() }}p>我们可以使用过滤器来修改变量，过滤器添加在变量名之后，中间用竖线分隔。
栗子，下面的模板以首字符大写形式显示变量name的值：
Hello,{{ name|capitalize }}列出一些Jinjia2常用的过滤器：
safe与转义
默认情况下，出于安全考虑，Jinjia2会转义所有的变量。转义的意思是如果一个变量的值是',Jinjia2会将其渲染成Hello
''<h1>Hello</h1>',浏览器可以显示这个h1元素（就是会显示出这个Hello，但是不会进行解释，变成标题1的样式）。但是很多情况下我们是需要显示变量中存储的HTML代码，这时候就可以使用safe过滤器。
注意：千万不要在不可信的值上使用safe过滤器，例如用户在表单中输入的文本。
笔者为我们提供了一个完整的过滤器列表的文档：
http://jinja.pocoo.org/docs/templates/#builtin-filters控制结构
条件控制语句：
{% if user %}
Hello,{{ user }}
{% else %}
Hello,Stranger!
{% endif %}另外一种常见的需求是在模板中渲染一组元素，下面展示如何使用for循环来实现这一需求：
<ul>
{% for comment in comments %}
<li>{{ comment }}li>
{% endfor %}
ul>Jinja2还支持宏。宏类似于Python代码中的函数，例如：
{% macro render_comment(comment) %}
<li>{{ comment }}li>
{% endmacro %}
<ul>
{% for comment in comments %}
{{ render_comment(comment) }}
{% endfor %}
ul>为了重复使用宏，我们可以将其保存在单独的文件中，然后在需要使用的模板中导入：
{% import 'macros.html' as macros %}
<ul>
{% for comment in comments %}
{{ macros.render_comment(comment) }}
{% endfor %}
ul>需要在多处重复使用的模板代码片段可以写入单独的文件，再包含在所有模板中，以避免重复：
{% include 'common.html' %}模板继承
另外一种使用代码的强大方式是模板继承，它类似于Python代码中的类继承。首先，创建一个base.html的基模板：
<html lang="en">
<head>
{% block head %}
<title>{% block title %}{% endblock %} - My Applicationtitle>
{% endblock %}
head>
<body>
{% block body %}
{% endblock %}
body>
html>block标签定义的元素可以在衍生模板中修改。
下面是这个示例是基模板的衍生模板：
{% 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()获取原来的内容。
使用Flask-Bootstrap集成Twitter Bootstrap
Bootstrap（http://getbootstrap.com/)是Twitter开发的一个开源框架，是一个客户端框架。服务器要做的知识提供引用了Bootstrap层叠样式表（CSS）和js文件的HTML响应，并在HTML、CSS和js代码中实例化所需组件。这些操作最理想的执行场所就是模板。
要想在程序中集成Bootstrap，显然要对模板做所有必要的改动。
不过当然有简单的办法了，安装Flask-Bootstrap的flask扩展
pip install flask-bootstrap初始化Flask-Bootstrap hello.py
from flask.ext.bootstrap import Bootstrap
# ...
bootstrap = Bootstrap(app)初始化Flask-Bootstrap之后，就可以在程序中使用一个包含素有Bootstrap文件的基模板。这个模板利用Jinja2的模板继承机制，让程序扩展一个具有页面结构的基模板，其中就有用来引入Bootstrap的元素。
给出一个把user.html改写成衍生模板后的新版本。
实例代码：
{% extends 'bootstrap/base.html' %}
{% block title %}Flasky{% endblock %}
{% block navbar %}
<div class = 'navbar navbar-inverse' role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target = '.navbar-collapse'>
<span class="sr-only">Toggle navigationspan>
<span class="icon-bar">span>
<span class="icon-bar">span>
<span class="icon-bar">span>
button>
<a class='navbar-brand' href="/">Flaskya>
div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li><a href="/">Homea>li>
ul>
div>
div>
div>
{% endblock %}
{% block content %}
<div class="container">
<div class="page-header">
<h1>Hello,{{ name }}h1>
div>
div>
{% endblock %}这个前端的框架表示不太懂，有兴趣的同学可以自己再学习……
基本笔者给我们的解释就是，上面的这个user.html模板定义了3个块，分别名为title、navbar和content。这些块都是基模板提供的，可在衍生模板中重新定义。
Flask-Bootstarp的base.html模板还定义了很多其他块，都可以在衍生模板中使用。下表列出了所有可用的块。
这其中的很多块都是Flask-Bootstrap自用的，如果直接重定义可能会导致一些问题。例如，Bootstrap所需的文件在styles和scripts块中声明。如果程序需要向已经有内容的块中添加新内容，必须使用Jinja2提供的super()函数。例如，如果要在衍生模板中添加新的js文件，需要这么定义script块：
{% block script %}
{{ super() }}
<script type="text/javascript" src="my-script.js">script>
{% endblock %}自定义错误页面
如果我们在浏览器的地址栏中输入了一个不可用的路由，就会出现一个状态码为404的错误页面。但是有时我们会觉得这个页面太平凡了…
Flask允许程序使用基于模板的自定义错误页面。
404，客户端请求未知页面或路由时显示；
500，有未处理的异常时显示；
举栗子时间，hello.py:自定义错误页面
@app.errorhandler(404)
def page_not_found(e):
return render_template('404.html'),404
@app.errorhandler(500)
def internal_server_error(e):
return render_template('500.html'),500然后我们需要在模板中定义404.html和500.html这两个文件，文中介绍了怎么用Bootstrap实现，我这里不做代码展示了，因为对前端这块不太熟…看着心累，手打一遍更心累…
基本思想说一下就是创建了一个templates/base.html 的基模板，然后其他页面通过模板继承机制继承。
链接
在模板中编写简单的url并不难，但是对于包含可变部分的动态路由，在模板中构建正确的URL就很困难。
直接编写URL会对代码中的路由产生不必要的依赖关系。如果重新定义路由，那么模板中的链接可能会失效。
为了避免这些问题，Flask提供了url_for()辅助函数，它可以使用程序URL映射中保存的信息生成URL。
比如我们在调用url_for(‘index’)的时候得到的结果是/。调用url_for(‘index’,_external=True) 返回的是则是绝对地址，这个示例中是”http://localhost:5000/”
要生成动态地址的时候，将动态部分作为关键字参数传入。
url_for(‘user’,name=’john’,_external=True)
返回的结果：http://localhost:5000/user/john
将额外的参数添加到查询字符串中，例如，url_for(’index‘,page=2)的返回结果/?page=2
静态文件
Web程序不是仅由Python代码和模板组成。例如HTML代码中引用的图片、JavaScript源码文件和CSS。
大家是否记得在第二章中检查hello.py程序的URL映射时，其中有一个static路由。这是因为对静态文件的引用被当做一个特殊的路由，即/static/
默认设置下，Flask在程序根目录中名为static的子目录中寻找静态文件。
举个栗子，我们如何在基模板中放置favicon.ico图标。这个图标会显示在浏览器的地址栏中。
<link rel="shortcut icon" href="{{url_for('static',filename='favicon.ico')}}" type="image/x-icon">使用Flask-Moment本地化日期和时间
服务器需要一个统一的时间，这和用户所在的地理位置无关，所以一般使用协调世界时间（UTC）。但是我们用户看到UTC格式的时间会困惑，因为我们更加习惯当地惯用的格式。
一个优雅的解决方案是，把时间单位发送给Web浏览器，转化成当地时间，然后渲染。Web浏览器可以更好地完成这一任务，因为它能获取用户电脑中的时区和区域设置。
有一个使用js开发的优秀的客户端开源代码库，moment.js，它可以在浏览器中渲染日期和时间。Flask-Moment是一个Flask程序扩展，能把moment.js集成Jinja2模板中。
安装：
pip install flask-momenthello.py:初始化Flask-Moment
from flask.ext.moment import Moment
app = Flask(__name__)
moment = Moment(app)在基模板templates/base.html中引入moment.js库
{% block scripts %}
{{ super() }}
{{ moment.include_moment() }}
{% endblock %}为了处理时间戳，Flask-Moment向模板开发了moment类，
举栗子，在hello.py中加入一个datetime变量
from datetime import datetime
@app.route('/')
def index():
return render_template('index.html',current_time = datetime.utcnow())然后我们来看下如何在模板中渲染current_time
templates/index.html：使用Flask-Moment渲染时间戳，
<p>The local date and time is {{ moment(current_time).format('LLL') }}.p>
<p>That was {{ moment(current_time).fromNow(refresh=True) }}p>format(‘LLL’)根据客户端电脑中的时区和区域设置渲染日期和时间。
注明：这里我也没有写得很仔细，大致滤了一遍原文…
第三章完结撒花