Python的Flask框架中的Jinja2模板引擎學(xué)習(xí)教程

更新時間：2016年06月30日 18:15:07 作者：ttlsa

這篇文章主要介紹了Python的Flask框架中的Jinja2模板引擎學(xué)習(xí)教程,Jinja2模板引擎的用法也是Flask的Web開發(fā)中的重要知識,需要的朋友可以參考下

Flask的模板功能是基于Jinja2模板引擎來實現(xiàn)的。模板文件存放在當(dāng)前目前下的子目錄templates（一定要使用這個名字）下。
main.py 代碼如下：

from flask import Flask, render_template
 
app = Flask(__name__)
 
@app.route('/hello')
@app.route('/hello/<name>')
def hello(name=None):
  return render_template('hello.html', name=name)
 
 
if __name__ == '__main__':
  app.run(debug=True)

hello.html代碼如下：

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Hello Sample</title>
</head>
<body>
{% if name %}
  <h1>Hello {{ name }} !</h1>
{% else %}
  <h1>Hello World!</h1>
{% endif %}
 
</body>
</html>

模板的表達(dá)式都是包含在分隔符”{{ }}”內(nèi)的；控制語句都是包含在分隔符”{% %}”內(nèi)的；另外，模板也支持注釋，都是包含在分隔符”{# #}”內(nèi)，支持塊注釋。
表達(dá)式

表達(dá)式一般有這么幾種：

最常用的是變量，由Flask渲染模板時傳過來，比如上例中的”name”
也可以是任意一種Python基礎(chǔ)類型，比如字符串{{ “Hello” }}，用引號括起；或者數(shù)值，列表，元祖，字典，布爾值。直接顯示基礎(chǔ)類型沒啥意義，一般配合其他表達(dá)式一起用
運算。包括算數(shù)運算，如{{ 2 + 3 }}；比較運算，如{{ 2 > 1 }}；邏輯運算，如{{ False and True }}
過濾器“|”和測試器“is”。這個在后面會介紹
函數(shù)調(diào)用，如{{ current_time() }}；數(shù)組下標(biāo)操作，如{{ arr[1] }}
“in”操作符，如{{ 1 in [1,2,3] }}
字符串連接符”~”，作用同Python中的”+”一樣，如{{ “Hello ” ~ name ~ “!” }}
“if”關(guān)鍵字，如{{ ‘Hi, %s' % name if name }}。這里的”if”不是條件控制語句。

控制語句

Jinja2的控制語句主要就是條件控制語句if，和循環(huán)控制語句for，語法類似于Python。我們可以改動下上節(jié)的模板代碼：

{% if name and name == 'admin' %}
  <h1>This is admin console</h1>
{% elif name %}
  <h1>Welcome {{ name }}!</h1>
{% else %}
  <h1>Please login</h1>
{% endif %}

上面是一個條件控制語句的例子，注意if控制語句要用”{% endif %}”來結(jié)束。模板中無法像代碼中一樣靠縮進(jìn)來判斷代碼塊的結(jié)束。再來看個循環(huán)的例子，我們先改下Python代碼中的”hello”函數(shù)，讓其傳兩個列表進(jìn)模板。

def hello(name=None):
  return render_template('hello.html', name=name, digits=[1,2,3,4,5],
              users=[{'name':'John'},
                 {'name':'Tom', 'hidden':True},
                 {'name':'Lisa'}
                 {'name':'Bob'}])

模板如下：

{% if name and name == 'admin' %}
  <h1>Helle admin</h1>
{% elif name %}
  <h1>"Hello" ~ {{ name }} ~ "!"</h1>
{% else %}
  <h1>Hello World!</h1>
{% endif %}
 
  {% for digit in digits %}
  {{ digit }}
  {% endfor %}

同if語句一樣，for控制語句要用”{% endfor %}”來結(jié)束。頁面上，每個元素之間會有空格，如果你不希望有空格，就要在”for”語句的最后，和”endfor”語句的最前面各加上一個”-“號。如：

 {% for digit in digits -%}
  {{ digit }}
 {%- endfor %}

你可以看到數(shù)字”12345″被一起顯示出來了。我們再來看個復(fù)雜的循環(huán)例子：

<dl>
  {% for user in users if not user.hidden %}
  {% if loop.first %}
  <div>User List:</div>
  {% endif %}
  <div class="{{ loop.cycle('odd', 'even') }}">
  <dt>User No. {{ loop.index }}</dt>
  <dd>{{ user.name }}</dd>
  </div>
  {% if loop.last %}
  <dir>Total Users: {{ loop.length }}</dir>
  {% endif %}
  {% else %}
  <li>No users found</li>
  {% endfor %}
</dl>

這里有三個知識點。首先for循環(huán)支持else語句，當(dāng)待遍歷的列表”users”為空或者為None時，就進(jìn)入else語句。
其次，在for語句后使用if關(guān)鍵字，可以對循環(huán)中的項作過濾。本例中，所有hidden屬性為True的user都會被過濾掉。
另外，for循環(huán)中可以訪問Jinja2的循環(huán)內(nèi)置變量。本例中，我們會在第一項前顯示標(biāo)題，最后一項后顯示總數(shù)，每一項顯示序號。另外，奇偶項的HTML div元素會有不同的class。如果我們加入下面的CSS style，就能看到斑馬線。

<style type="text/css">
  .odd {
    background-color: #BDF;
  }
</style>

Jinja2的循環(huán)內(nèi)置變量主要有以下幾個：

from flask import Flask, render_template

app = Flask(__name__)

@app.route('/hello')

@app.route('/hello/<name>')

def hello(name=None):

return render_template('hello.html', name=name)

if __name__ == '__main__':

app.run(debug=True)

另外，如果你啟用了”jinja2.ext.loopcontrols”擴展的話，你還可以在循環(huán)中使用”{% break %}”和”{% continue %}”來控制循環(huán)執(zhí)行。
其它常用語句：

忽略模板語法

有時候，我們在頁面上就是要顯示”{{ }}”這樣的符號怎么辦？Jinja2提供了”raw”語句來忽略所有模板語法。

{% raw %}
  <ul>
  {% for item in items %}
    <li>{{ item }}</li>
  {% endfor %}
  </ul>
{% endraw %}

自動轉(zhuǎn)義

我們將本文一開始的Flask代碼”hello()”方法改動下：

@app.route('/hello')
@app.route('/hello/<name>')
def hello(name=None):
  if name is None:
    name = '<em>World</em>'
  return render_template('hello.html', name=name)

此時，訪問”http://localhost:5000/hello”，頁面上會顯示”Welcome <em>World</em>!”，也就是這個HTML標(biāo)簽”<em>”被自動轉(zhuǎn)義了。Flask會對”.html”, “.htm”, “.xml”, “.xhtml”這四種類型的模板文件開啟HTML格式自動轉(zhuǎn)義。這樣也可以防止HTML語法注入。如果我們不想被轉(zhuǎn)義怎么辦？

{% autoescape false %}
 <h1>Hello {{ name }}!</h1>
{% endautoescape %}

將”autoescape”開關(guān)設(shè)為”false”即可，反之，設(shè)為”true”即開啟自動轉(zhuǎn)義。使用”autoescape”開關(guān)前要啟用”jinja2.ext.autoescape”擴展，在Flask框架中，這個擴展默認(rèn)已啟用。
賦值

使用”set”關(guān)鍵字給變量賦值：

{% set items = [[1,2],[3,4,5]] %}

with語句

類似于Python中的”with”關(guān)鍵字，它可以限制with語句塊內(nèi)對象的作用域：

{% with foo = 1 %}
  {% set bar = 2 %}
  {{ foo + bar }}
{% endwith %}
{# foo and bar are not visible here #}

使用”with”關(guān)鍵字前要啟用”jinja2.ext.with_”擴展，在Flask框架中，這個擴展默認(rèn)已啟用。
執(zhí)行表達(dá)式

{% with arr = ['Sunny'] %}
 {{ arr.append('Rainy') }}
 {{ arr }}
{% endwith %}

看上面這段代碼，我們想執(zhí)行列表的”append”操作，這時使用”{{ arr.append(‘Rainy') }}”頁面會輸出”None”，換成”{% %}”來執(zhí)行，程序會報錯，因為這是個表達(dá)式，不是語句。那怎么辦？我們可以啟用”jinja2.ext.do”擴展。然后在模板中執(zhí)行”do”語句即可：

{% with arr = ['Sunny'] %}
 {% do arr.append('Rainy') %}
 {{ arr }}
{% endwith %}

上下文環(huán)境
Flask每個請求都有生命周期，在生命周期內(nèi)請求有其上下文環(huán)境Request Context。作為在請求中渲染的模板，自然也在請求的生命周期內(nèi)，所以Flask應(yīng)用中的模板可以使用到請求上下文中的環(huán)境變量，及一些輔助函數(shù)。本文就會介紹下這些變量和函數(shù)。
標(biāo)準(zhǔn)上下文變量和函數(shù)

請求對象request
request對象可以用來獲取請求的方法”request.method”，表單”request.form”，請求的參數(shù)”request.args”，請求地址”request.url”等。它本身是一個字典。在模板中，你一樣可以獲取這些內(nèi)容，只要用表達(dá)式符號”{{ }}”括起來即可。

<p>{{ request.url }}</p>

在沒有請求上下文的環(huán)境中，這個對象不可用。
會話對象session
session對象可以用來獲取當(dāng)前會話中保存的狀態(tài)，它本身是一個字典。在模板中，你可以用表達(dá)式符號”{{ }}”來獲取這個對象。
Flask代碼如下，別忘了設(shè)置會話密鑰哦：

@app.route('/')
def index():
  session['user'] = 'guest'
  return render_template('hello.html')
 
app.secret_key = '123456'

模板代碼：

<p>User: {{ session.user }}</p>

在沒有請求上下文的環(huán)境中，這個對象不可用。
全局對象g
全局變量g，用來保存請求中會用到全局內(nèi)容，比如數(shù)據(jù)庫連接。模板中也可以訪問。
Flask代碼：

@app.route('/')
def index():
  g.db = 'mysql'
  return render_template('hello.html')

模板代碼：

<p>DB: {{ g.db }}</p>

g對象是保存在應(yīng)用上下文環(huán)境中的，也只在一個請求生命周期內(nèi)有效。在沒有應(yīng)用上下文的環(huán)境中，這個對象不可用。
Flask配置對象config
導(dǎo)入的配置信息，就保存在”app.config”對象中。這個配置對象在模板中也可以訪問。

 <p>Host: {{ config.DEBUG }}</p>

“config”是全局對象，離開了請求生命周期也可以訪問。
url_for()函數(shù)
url_for()函數(shù)可以用來快速獲取及構(gòu)建URL，F(xiàn)lask也將此函數(shù)引入到了模板中，比如下面的代碼，就可以獲取靜態(tài)目錄下的”style.css”文件。

<link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">

該函數(shù)是全局的，離開了請求生命周期也可以調(diào)用。
get_flashed_messages()函數(shù)
get_flashed_messages()函數(shù)是用來獲取消息閃現(xiàn)的。這也是一個全局可使用的函數(shù)。
自定義上下文變量和函數(shù)

自定義變量
除了Flask提供的標(biāo)準(zhǔn)上下文變量和函數(shù)，我們還可以自己定義。下面我們就來先定義一個上下文變量，在Flask應(yīng)用代碼中，加入下面的函數(shù)：

from flask import current_app
 
@app.context_processor
def appinfo():
  return dict(appname=current_app.name)

函數(shù)返回的是一個字典，里面有一個屬性”appname”，值為當(dāng)前應(yīng)用的名稱。我們曾經(jīng)介紹過，這里的”current_app”對象是一個定義在應(yīng)用上下文中的代理。函數(shù)用”@app.context_processor”裝飾器修飾，它是一個上下文處理器，它的作用是在模板被渲染前運行其所修飾的函數(shù)，并將函數(shù)返回的字典導(dǎo)入到模板上下文環(huán)境中，與模板上下文合并。然后，在模板中”appname”就如同上節(jié)介紹的”request”, “session”一樣，成為了可訪問的上下文對象。我們可以在模板中將其輸出：

<p>Current App is: {{ appname }}</p>

自定義函數(shù)
同理我們可以自定義上下文函數(shù)，只需將上例中返回字典的屬性指向一個函數(shù)即可，下面我們就來定義一個上下文函數(shù)來獲取系統(tǒng)當(dāng)前時間：

import time
 
@app.context_processor
def get_current_time():
  def get_time(timeFormat="%b %d, %Y - %H:%M:%S"):
    return time.strftime(timeFormat)
  return dict(current_time=get_time)

我們可以試下在模板中將其輸出：

<p>Current Time is: {{ current_time() }}</p>
 <p>Current Day is: {{ current_time("%Y-%m-%d") }}</p>

上下文處理器可以修飾多個函數(shù)，也就是我們可以定義多個上下文環(huán)境變量和函數(shù)。
完整實例：
flask代碼：

from flask import Flask, render_template, session, g, current_app
import time
 
app = Flask(__name__)
 
@app.route('/')
def index():
  session['user'] = 'guest'
  g.db = 'mysql'
  return render_template('hello-2.html')
 
@app.context_processor
def appinfo():
  return dict(appname=current_app.name)
 
@app.context_processor
def get_current_time():
  def get_time(timeFormat="%b %d, %Y - %H:%M:%S"):
    return time.strftime(timeFormat)
  return dict(current_time=get_time)
 
app.secret_key = '123456'
 
if __name__ == '__main__':
  app.run(debug=True)

模板代碼：

<!doctype html>
<title>Hello Sample</title>
<link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
 <h1>Hello World!</h1>
 <p>Request URL: {{ request.url }}</p>
 <p>User: {{ session.user }}</p>
 <p>DB: {{ g.db }}</p>
 <p>Host: {{ config.DEBUG }}</p>
 <p>Current App is: {{ appname }}</p>
 <p>Current Time is: {{ current_time() }}</p>
 <p>Current Day is: {{ current_time("%Y-%m-%d") }}</p>
 
{% with messages = get_flashed_messages() %}
 {% if messages %}
  {% for message in messages %}
   Flash Message: {{ message }}</li>
  {% endfor %}
 {% endif %}
{% endwith %}

您可能感興趣的文章: