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

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

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

Flask的模板功能是基于Jinja2模板引擎來(lái)實(shí)現(xiàn)的。模板文件存放在當(dāng)前目前下的子目錄templates（一定要使用這個(gè)名字）下。
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)的；控制語(yǔ)句都是包含在分隔符”{% %}”內(nèi)的；另外，模板也支持注釋，都是包含在分隔符”{# #}”內(nèi)，支持塊注釋。
表達(dá)式

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

最常用的是變量，由Flask渲染模板時(shí)傳過(guò)來(lái)，比如上例中的”name”
也可以是任意一種Python基礎(chǔ)類型，比如字符串{{ “Hello” }}，用引號(hào)括起；或者數(shù)值，列表，元祖，字典，布爾值。直接顯示基礎(chǔ)類型沒(méi)啥意義，一般配合其他表達(dá)式一起用
運(yùn)算。包括算數(shù)運(yùn)算，如{{ 2 + 3 }}；比較運(yùn)算，如{{ 2 > 1 }}；邏輯運(yùn)算，如{{ False and True }}
過(guò)濾器“|”和測(cè)試器“is”。這個(gè)在后面會(huì)介紹
函數(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”不是條件控制語(yǔ)句。

控制語(yǔ)句

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

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

上面是一個(gè)條件控制語(yǔ)句的例子，注意if控制語(yǔ)句要用”{% endif %}”來(lái)結(jié)束。模板中無(wú)法像代碼中一樣靠縮進(jìn)來(lái)判斷代碼塊的結(jié)束。再來(lái)看個(gè)循環(huán)的例子，我們先改下Python代碼中的”hello”函數(shù)，讓其傳兩個(gè)列表進(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語(yǔ)句一樣，for控制語(yǔ)句要用”{% endfor %}”來(lái)結(jié)束。頁(yè)面上，每個(gè)元素之間會(huì)有空格，如果你不希望有空格，就要在”for”語(yǔ)句的最后，和”endfor”語(yǔ)句的最前面各加上一個(gè)”-“號(hào)。如：

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

你可以看到數(shù)字”12345″被一起顯示出來(lái)了。我們?cè)賮?lái)看個(gè)復(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>

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

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

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

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”擴(kuò)展的話，你還可以在循環(huán)中使用”{% break %}”和”{% continue %}”來(lái)控制循環(huán)執(zhí)行。
其它常用語(yǔ)句：

忽略模板語(yǔ)法

有時(shí)候，我們?cè)陧?yè)面上就是要顯示”{{ }}”這樣的符號(hào)怎么辦？Jinja2提供了”raw”語(yǔ)句來(lái)忽略所有模板語(yǔ)法。

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

自動(dòng)轉(zhuǎn)義

我們將本文一開(kāi)始的Flask代碼”hello()”方法改動(dòng)下：

@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)

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

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

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

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

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

with語(yǔ)句

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

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

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

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

看上面這段代碼，我們想執(zhí)行列表的”append”操作，這時(shí)使用”{{ arr.append(‘Rainy') }}”頁(yè)面會(huì)輸出”None”，換成”{% %}”來(lái)執(zhí)行，程序會(huì)報(bào)錯(cuò)，因?yàn)檫@是個(gè)表達(dá)式，不是語(yǔ)句。那怎么辦？我們可以啟用”jinja2.ext.do”擴(kuò)展。然后在模板中執(zhí)行”do”語(yǔ)句即可：

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

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

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

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

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

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

模板代碼：

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

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

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

模板代碼：

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

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

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

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

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

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

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

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

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

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

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

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>

上下文處理器可以修飾多個(gè)函數(shù)，也就是我們可以定義多個(gè)上下文環(huán)境變量和函數(shù)。
完整實(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 %}

您可能感興趣的文章: